使用Parcel与TypeScript时绝对路径导入失败问题求助

问题根源 #

VS Code会读取tsconfig.json中的baseUrl和paths配置来做代码提示与模块解析，但Parcel作为构建工具，不会自动继承TypeScript的路径映射规则，导致构建时无法识别app/xxx这类导入路径。同时你的tsconfig.json中paths配置存在冗余，会引发解析歧义。

修复步骤 #

1. 修正tsconfig.json的路径映射 #

当前paths里的"src/*"是多余的（因为baseUrl已经设置为src，再写src/*会指向src/src/xxx这种不存在的路径），修改为：

{
  "compilerOptions": {
    // 其他配置保持不变
    "baseUrl": "src",
    "paths": {
      "app/*": ["*"]
    }
  }
}

这样app/BaseResolution会被TypeScript正确解析到src/BaseResolution.ts。

2. 给Parcel配置别名 #

在项目根目录的package.json中添加alias字段，让Parcel匹配TypeScript的路径规则：

{
  // 原有package.json内容...
  "alias": {
    "app/*": "./src/*"
  }
}

3. 重启Parcel构建进程 #

停止当前的parcel watch命令，重新执行：

parcel watch --dist-dir wwwroot/res/js/build src/Main.ts

此时Parcel就能正确解析app/xxx格式的导入，和VS Code的解析逻辑保持一致。

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