Angular集成Node Express后tsconfig.json中outDir的作用疑问

算力阿峰

2026-5-21

关于Angular CLI中tsconfig.json与angular-cli.json outDir的区别

这个问题其实涉及到Angular CLI和TypeScript编译器各自配置的职责划分，我来给你理清楚：

tsconfig.json里的outDir：TypeScript编译器的原生配置
这个配置是给TypeScript的核心编译器tsc用的——当你直接运行tsc命令（跳过Angular CLI）来编译TypeScript代码时，编译后的纯JavaScript文件会输出到./dist/out-tsc这个目录。它只负责TS到JS的基础转换，不涉及Angular应用构建的额外步骤（比如打包、资源处理、代码优化等）。
angular-cli.json里的outDir：Angular CLI构建流程的全局输出控制
当你执行ng build时，Angular CLI启动的是一套完整的构建流水线：它会调用tsc编译TS，但同时还会做很多额外工作——比如用Webpack打包代码、处理样式文件（转译SCSS/SASS、添加前缀）、压缩优化代码、生成并注入脚本到index.html、拷贝静态资源等等。
为了统一管理所有构建产物的输出位置，CLI会忽略tsconfig.json里的outDir，转而使用自身配置文件中的outDir来指定最终产物的存放目录，这就是为什么你执行ng build后，文件都到了CLI配置的目录，而./dist/out-tsc并未被创建。
什么时候会用到tsconfig的outDir？
如果你需要单独编译某部分独立的TypeScript代码（比如项目里的工具脚本，不属于Angular应用的核心代码），直接运行tsc命令时，就会遵循这个配置生成文件到指定目录。另外，在一些自定义的构建脚本中，手动调用tsc而不通过Angular CLI的场景下，这个配置也会生效。