Webpack人力资源管理打字重编问题

Question

我正在使用webpack babel typescript react，一切都运行得很好，但是当在dev模式下热重新加载不能重新编译ts文件时，我遇到了一个问题，假设我有一个这样的模型

type Model = {
   prop: string;
}

正在运行的项目显示我'Compilled‘，但如果我需要将此属性更改为number，

type Model = {
   prop: number;
}

我会收到

[tsl] ERROR in /src/app/modules/home/home.component.tsx(14,57)
TS2322: Type 'number' is not assignable to type 'string'.

在我完全重新加载/重建项目之前，此错误不会消失

此外，我还注意到只有当我将模型拆分成单独的文件时，才会发生这种情况，例如：

src/foo.component.ts
src/foo.model.ts

在本例中，直到我重新加载构建之前，我都会得到这个错误，但是如果我将模型放在与组件相同的文件中，它不会给出任何错误

这是我的tsconfig.json

{
  "compileOnSave": true,
  "compilerOptions": {
    "allowSyntheticDefaultImports": true,
    "skipLibCheck": true,
    "outDir": "./dist",
    "baseUrl": "./",
    "sourceMap": true,
    "declaration": false,
    "jsx": "react",
    "module": "ESNext",
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "esModuleInterop": true,
    "target": "ES2015",
    "typeRoots": ["node_modules/@types"],
    "lib": ["es2017", "dom"],
    "paths": {},
  },
  "include": ["./src/**/*"],
  "exclude": ["node_modules", "@types"]
}

那么，在没有完全重新启动项目的情况下，如何让它在类型更改时重新编译文件呢？

Answer 1

通过添加ForkTsCheckerWebpackPlugin解决了这个问题