Vue3+Vite+TS组件库：tsconfig与package.json配置emitDeclarationOnly的区别

为什么第一种配置报错？ #

你碰到的Option 'emitDeclarationOnly' cannot be specified with option 'noEmit'报错，根源不在你的主tsconfig.json，而是来自你引用的tsconfig.node.json。Vite默认生成的tsconfig.node.json里会设置"noEmit": true（它仅用于Vite配置文件的类型校验，不需要编译输出任何文件）。当使用TypeScript的project references特性时，子配置的noEmit会和主配置的emitDeclarationOnly产生冲突——这两个选项本质互斥，一个要求不输出任何文件，另一个要求只输出声明文件，自然会触发报错。

两种配置方式的核心差异 #

1. 在tsconfig.json中直接配置emitDeclarationOnly: true #

• 执行主体：由TypeScript原生编译器tsc负责生成声明文件，同时触发整个项目的类型检查。
• 冲突风险：如果项目使用project references（比如引用tsconfig.node.json），子配置的noEmit会和主配置的emitDeclarationOnly冲突，导致报错。
• 适用场景：适合未使用project references的纯TS项目，或者能调整project references配置（比如确保子配置不干扰主配置的输出规则）的场景。

2. 使用vite build && vue-tsc --emitDeclarationOnly #

• 执行主体：分工明确——vite build负责打包组件库的JS/CSS等生产产物，vue-tsc（基于tsc的Vue增强工具）单独负责生成.d.ts声明文件，同时完成Vue单文件组件的类型校验。
• 无冲突原因：vue-tsc --emitDeclarationOnly是独立执行的命令，会忽略project references中noEmit的影响，以专属上下文处理Vue项目的类型和声明生成，避免了配置冲突。
• 适用场景：是Vue3 + Vite组件库项目的最优选择，vite更适配Vue的打包需求，而vue-tsc能完美支持单文件组件的类型检查与声明生成，两者配合各司其职，效率更高。

第一种配置的可选修复方案 #

如果你想沿用第一种方式，可修改tsconfig.node.json，确保其compilerOptions中declaration为false，或者在主tsconfig.json中针对references添加覆盖配置，但整体来看，第二种方式更适配Vue3 + Vite的项目架构。

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