import cost插件未生效需检查四项：①文件语言模式是否为javascript/typescript；②插件是否已启用；③导入路径是否为node_modules内、动态import或条件导入；④包是否支持exports字段静态分析，否则仅单入口umd或明确exports的包可准确估算。

Import Cost插件装了但没反应？检查是否启用并匹配文件类型

Import Cost默认只在支持的JavaScript/TypeScript文件中生效，不是所有.js或.ts都会自动触发——它依赖VSCode的语言模式识别。如果你打开的是foo.js但右下角显示“Plain Text”，插件就完全不工作。

• 手动设置语言模式：按 Ctrl+Shift+P（Windows/Linux）或 Cmd+Shift+P（macOS），输入 Change Language Mode，选 JavaScript 或 TypeScript
• 确认插件已启用：在扩展面板搜索 Import Cost，检查是否显示“已启用”，禁用后重启VSCode也不行
• 注意文件路径：它对node_modules内路径、动态import()、带条件逻辑的导入（如process.env.NODE_ENV === 'dev' && import('./debug')）不计算

为什么import _ from 'lodash'显示大小，但import { debounce } from 'lodash'不显示？

Import Cost依赖包的package.json中main、module、exports字段做静态分析，而lodash这类采用“模块化导出 + 副作用清理”的库，在未配置exports映射时，插件无法推断{ debounce }实际引入的代码路径，直接放弃估算。

• 常见“不显示”的库： lodash、date-fns（v2+）、ramda —— 它们用ESM子路径导出，但Import Cost没走完整解析流程
• 能正常显示的通常是：单入口UMD包（如axios）、有明确exports定义的现代包（如zod）
• 临时验证方法：把import { debounce } from 'lodash'改成import debounce from 'lodash/debounce'，通常就能看到体积

import('@/utils/request')这种别名路径不显示大小？配好jsconfig.json或tsconfig.json

Import Cost不读取Webpack/Vite的resolve.alias，只认VSCode原生理解的路径映射——也就是jsconfig.json或tsconfig.json里的compilerOptions.baseUrl和compilerOptions.paths。

VSCode

避免常见的 VSCode 错误——设置冲突、调试器配置和扩展冲突。

下载

• 确保项目根目录有jsconfig.json（JS项目）或tsconfig.json（TS项目）
• 里面必须包含类似这样的配置：

  {
    "compilerOptions": {
      "baseUrl": ".",
      "paths": {
        "@/*": ["src/*"]
      }
    }
  }

• 改完配置后，需要关闭再重新打开文件夹（热重载不触发Import Cost重分析）

体积数字后面带~（比如~4.2 kB）是什么意思？

那个~不是误差提示，而是明确告诉你：这个值是估算值，不是真实打包后的产物大小。它基于node_modules里源码的压缩前字节数（gzip前），且未考虑Tree Shaking、编译转换（如TS转JS）、代码分割等构建时行为。

• 真实构建体积请用 npm run build -- --stats（Vite）或 webpack-bundle-analyzer（Webpack）
• ~还意味着：如果包用了exports条件导出（如"import" vs "require"），插件可能随机选了一个入口，结果偏差较大
• 别把它当性能指标看，只当“粗略感知”——比如发现import * as THREE from 'three'标着~780 kB，你就该立刻切到import { Mesh, Scene } from 'three'

事情说清了就结束。真正影响打包体积的，从来不是Import Cost显示的数字，而是你有没有在写代码时，下意识多看一眼那个~。