能否配置Vite/Rollup仅对入口依赖文件执行vue-tsc?
解决vue-tsc编译/src全部文件的配置方案
要让vue-tsc只编译当前模块入口依赖的代码,核心是通过tsconfig.json限制类型检查的文件范围,再配合自定义配置文件实现分模块处理,具体步骤如下:
1. 缩小tsconfig.json的检查范围
vue-tsc默认会扫描tsconfig.json中include字段指定的所有文件(默认通常是["src/**/*"]),需要修改该字段,只包含当前正在重构的模块及它的依赖文件。
方式一:直接指定需要检查的文件
比如当前只处理cards模块,修改tsconfig.json:
{ "compilerOptions": { // 原有编译配置保持不变 }, "include": [ "src/pages/cards/**/*.ts", "src/pages/cards/**/*.vue", "src/utils/card-helper.ts" // 假设cards模块依赖此工具文件 ], "exclude": [ "node_modules", "dist" ] }
方式二:排除未重构的模块
如果src下有多个未重构模块,可先排除所有非目标模块,再反向包含需要处理的部分:
{ "compilerOptions": { // 原有编译配置保持不变 }, "include": [ "src/**/*" ], "exclude": [ "node_modules", "dist", "src/pages/profile/**/*", // 排除未重构的profile模块 "src/pages/settings/**/*" // 排除未重构的settings模块 ] }
2. 用自定义tsconfig文件实现分模块检查
如果需要频繁切换不同模块的检查范围,可为每个模块单独创建tsconfig文件,比如tsconfig.cards.json,继承主配置并覆盖include/exclude:
// tsconfig.cards.json { "extends": "./tsconfig.json", "include": [ "src/pages/cards/**/*" ], "exclude": [] }
然后在package.json的scripts里添加对应类型检查命令:
{ "scripts": { "type-check": "vue-tsc --noEmit", "type-check:cards": "vue-tsc --noEmit --project tsconfig.cards.json" } }
执行npm run type-check:cards时,就只会检查cards模块的文件。
3. 配合Vite构建配置(已有基础)
你当前的Vite配置已经通过rollupOptions.input指定了cards模块的入口,构建阶段只会打包该入口依赖的文件,这部分无需修改。类型检查范围仍需靠tsconfig控制,两者配合即可实现分模块逐步重构的需求。
内容的提问来源于stack exchange,提问作者Brian
相关产品推荐
相关产品推荐

