如何在WebStorm/IntelliJ中无需生成Sourcemap，通过Ava调试TypeScript并设置断点？

我之前也被这个问题卡了好久，试了好几种方法，终于找到几个不需要生成sourcemap就能直接在WebStorm/IntelliJ里给TypeScript的Ava测试设断点的路子，分享给你：

方案1：WebStorm内置Ava配置+ts-node实时编译 #

这是最省心的方法，不需要改太多配置：

• 先打开WebStorm的「Settings → Languages & Frameworks → TypeScript」，勾选「Compile on save」，但一定要取消勾选「Generate source maps」。
• 点击右上角的「Edit Configurations」，新增一个「Ava」类型的配置：
  • 在「Test file/pattern」里填你的测试文件路径，比如src/**/*.test.ts
  • 切换到「Configuration」标签，在「Node parameters」里加上--require ts-node/register
  • 保存配置后，直接在你的TypeScript测试文件里打个断点，启动调试就行。ts-node会实时把TS转成JS，WebStorm能直接关联到原TS文件的断点，完全不用提前生成sourcemap。

方案2：配置Ava的ts-node loader支持 #

如果你的项目用的是ESM模块，这个方案更适配：

• 先装依赖：npm install --save-dev ts-node typescript @types/node
• 修改package.json里的Ava配置：

  "ava": {
    "extensions": {
      "ts": "module"
    },
    "nodeArguments": [
      "--loader=ts-node/esm"
    ]
  }
  

• 然后在WebStorm里创建Ava调试配置，直接指向你的测试脚本，启动调试时WebStorm会通过ts-node的loader实时处理TS文件，断点直接就能命中原TS代码，不需要任何sourcemap文件。

方案3：Attach到Node调试进程 #

如果上面两种方法都不生效，可以试试这种手动attach的方式：

• 先在终端里启动Ava测试，加上调试参数：npx ava --inspect-brk src/**/*.test.ts
• 回到WebStorm，新增一个「Attach to Node.js/Chrome」的配置，默认端口是9229，直接启动调试。这种方式下，ts-node会负责TS的实时编译，WebStorm能自动把断点映射到原TS文件，同样不需要提前生成sourcemap。

额外注意事项 #

• 确保你的tsconfig.json里的compilerOptions和项目模块类型匹配：如果用CommonJS，module设为CommonJS；如果用ESM，module设为ESNext，target至少选ES2018+。
• 别在WebStorm的TypeScript编译设置里开sourcemap，不然反而可能打乱断点的映射逻辑。

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