TypeScript省略未使用导入的官方原因及可配置性咨询

先看示例代码：

// other.js|ts
console.log("module sideeffect") 
export function foo() {}

// main.js|ts 
import {foo} from "./other"; // foo 未被使用  

console.log("do something else"); 

这个场景下JS和TS表现存在差异：

• JavaScript会正常导入./other模块，执行其中的副作用代码console.log("module sideeffect")
• TypeScript会直接移除这条未用到的导入语句，导致副作用代码无法执行

如果改成以下导入方式，TypeScript就会触发模块副作用：

import "./other"; 

一、TypeScript省略未使用导入的官方原因 #

TypeScript的核心设计目标之一是优化编译后代码的体积与运行性能。当导入的变量、函数等绑定（比如示例中的foo）完全未被使用时，TS会判定这条导入要么仅用于静态类型检查，要么没有实际运行时用途，因此在编译阶段会将其移除——以此减少最终输出的JS文件大小，避免不必要的模块加载开销。

同时，TS会明确区分「类型导入」和「运行时导入」：若导入的内容仅为类型（如接口、类型别名），本身就会在编译时被擦除；对于包含运行时代码的模块，TS需要开发者通过明确的语法（如不带绑定的import "./module"）表明要触发其副作用，否则会默认优化掉未使用的导入语句。

二、该行为是否可配置？ #

可以通过tsconfig.json中的编译选项调整：

1. preserveValueImports（TypeScript 5.0+推荐使用）
   当设置为true时，即使导入的绑定未被使用，TS也会保留这条导入语句（前提是模块并非纯类型模块），确保模块的副作用代码能被执行。配置示例：

   {
     "compilerOptions": {
       "preserveValueImports": true
     }
   }
   

2. importsNotUsedAsValues（旧版本选项，TS 5.0+已被替代）
   该选项控制未使用导入的处理逻辑，有三个可选值：

   • remove：默认行为，移除未使用的导入
   • preserve：保留所有未使用的导入，无论是否为类型
   • error：将未使用的导入视为错误，强制开发者处理
     若要确保副作用执行，可将其设置为preserve。

不过最稳妥的方式还是直接使用副作用导入语法（import "./module"）——这种写法不受任何配置影响，能100%保证模块的副作用代码被执行，避免因配置变更或TS版本升级导致的行为变化。

内容的提问来源于stack exchange，提问作者dwjohnston