根本原因是webstorm默认按commonjs推导模块，而项目使用esmodule但未明确告知；需检查package.json是否含"type": "module"，或手动设置javascript版本为es6+并重载项目。
WebStorm 识别不了 import 或报 Unresolved variable
根本原因不是 WebStorm “不支持”，而是它默认按 CommonJS（require）推导模块，而你项目里用了 ESModule（import），但没告诉它“这个项目该用哪种规范解析”。
- 检查项目根目录是否有
package.json，且含"type": "module"—— 这是 Node.js 级别的开关，WebStorm 会读取它来切换解析器 - 没有
"type": "module"？那就必须靠.js文件后缀判断：ESM 默认只认.mjs，.js文件仍被当 CommonJS 处理 - 临时解法：右键单个
.js文件 → Override File Type → 选 JavaScript (ES6)，但这不持久，也不解决跨文件跳转
WebStorm 跳转 import 报错或失效
跳转失败通常不是路径写错了，而是 WebStorm 没把当前文件当成 ESM 上下文，导致它不解析 import 语句、也不索引导出名。
- 确认
Settings > Languages & Frameworks > JavaScript > Libraries里没误勾Enable JavaScript language service（旧版 WebStorm 可能因此降级解析逻辑） - 确保
Settings > Languages & Frameworks > JavaScript的版本设为ECMAScript 6+（不是ES5） - 如果用了
exports字段（比如在package.json中配了"exports": { ".": "./dist/index.js" }），WebStorm 2022.3+ 才开始支持，老版本直接跳不到
require 和 import 混用时 WebStorm 提示冲突
Node.js 允许通过 createRequire 在 ESM 里调 require，但 WebStorm 不会自动理解这种混合上下文，容易标红或推断错误。
- 避免在同一个文件里混用；真要兼容，把
require相关逻辑抽到单独的.cjs文件里，并确保该文件后缀明确 - 别依赖 WebStorm 自动补全
require('./xxx')的 ESM 导出名——它此时按 CommonJS 解析，只会找module.exports，找不到就报Unresolved variable - 若用
import()动态导入，WebStorm 对它的类型推断很弱，别指望它能跳转或提示导出成员
Webpack/Vite 项目里 WebStorm 仍按 CommonJS 解析
构建工具的配置（如 resolve.extensions、alias）WebStorm 不读，它只看文件系统和 package.json 的 type 字段，以及你手动设置的路径映射。
- 在
Settings > Languages & Frameworks > JavaScript > Libraries > Add里添加node_modules并勾选Download sources，否则第三方包里的export声明无法被索引 - 如果有
jsconfig.json或tsconfig.json，确保含"moduleResolution": "node"和"module": "ESNext"—— WebStorm 会参考这些字段，但不会完全照搬 - 别信“重启 WebStorm 就好”：改完
package.json后必须手动触发 File > Reload project from disk，否则缓存的模块类型不会更新
最常被忽略的是：WebStorm 的模块解析是静态的、基于文件扩展名和 package.json 的 type 字段做一次性判断，它不执行代码、不读构建配置、也不模拟 Node.js 的运行时解析规则。哪怕你的 Vite 项目跑得飞起，WebStorm 依然可能在编辑器里标红——这不是 bug，是设计如此。
