Webpack包含意外目录中的文件

Question

我有两个webpack配置，旨在针对以下目录结构中的两个不同内容

./scripts/react/TestA.tsx
./scripts/typescript/TestB.tsx

它们似乎是相互隔离的，每个都没有导入，但当我用webpack.config.js 运行构建时

module.exports = {
entry:{
typescript:[__dirname + "/../scripts/typescript/TestB.tsx"]
},
module:{
rules:[
{
test:/.tsx$/,
exclude:[__dirname + "/../node_modules"],
use:{ loader:"ts-loader" }
}
]
}
}

它处理构建很好，但在文件夹中出现了错误，我没想到

asset typescript.js 1.54 KiB [emitted] (name: typescript)
./scripts/typescript/TestB.tsx 69 bytes [built] [code generated]
ERROR in ***/scripts/react/TestA.tsx

为什么会发生这种情况？有没有办法阻止这种情况？我试图将其添加到排除选项中，但似乎没有任何区别(我可能做错了(

exclude:[__dirname + "/../node_modules", __dirname + "/../scripts/react/"],

Answer 1

Webpack与此无关。导致此问题的是TypeScript类型检查器。TypeScript编译工作在文件夹级别。因此，即使您的Webpack在依赖关系图中没有真正包括其他文件，TypeScript类型检查器仍然会对项目中的所有文件进行类型检查。

TypeScript的类型检查从检测到tsconfig.json文件的根文件夹开始。它检查所有的文件。这是默认行为。您可以使用baseUrl选项更改该行为。

作为一个快速解决方案，由于您打算生成两个不同的生成，这意味着您可以将它们视为组合生成，这意味着您应该在两个不同文件夹中有两个项目，并将两个不同tsconfig.json文件用于两个项目。通过这样做，一个项目的类型检查不会影响另一个项目。