tsconfig noEmit必须为true

Question

我正在使用create-react-app，我还有一些ts和tsx文件。在我的tsconfig文件中(见下文)，我将noEmit设置为false，因为需要发出js文件。但是，每次启动服务器时，noEmit都被设置为false，并显示以下消息：

The following changes are being made to your tsconfig.json file:
   - compilerOptions.noEmit must be true

当noEmit设置为false时，不会生成应该从ts文件生成的js文件，这意味着应用程序不会更新。是什么导致了这种行为？有什么方法可以避免它吗？

{
  "compilerOptions": {
    "target": "ES2017",
    "module": "esnext",
    "lib": [
      "dom",
      "dom.iterable",
      "esnext",
      "ES2017"
    ],
    "allowJs": false,
    "skipLibCheck": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "forceConsistentCasingInFileNames": true,
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "jsx": "preserve",
    "strictPropertyInitialization": false,
    "strictNullChecks": false,
    "strict": true,
    "sourceMap": true,
    "noEmit": true
  },
  "include": [
    "src"
  ],
  "exclude": [
    "node_modules"
  ]
}

Answer 1

您需要在webpack.config文件中覆盖此编译选项，如下所示：

rules: [
     {
        test: /\.tsx?$/,
        loader: 'ts-loader',
        options: {
           compilerOptions: {
              "noEmit": false
           }
        },
        exclude: /node_modules/,
      },

Answer 2

您可以在命令执行后从react-script恢复文件更改。

在我的例子中，这是使我发出问题的测试脚本。因此，我在package.json文件中添加了以下内容：

  [...]
  "scripts": {
    "pretest": "cp tsconfig.json tsconfig.json.save",
    "posttest": "mv tsconfig.json.save tsconfig.json",
    [...]
  }

但是，如果测试失败，则不会将文件重命名为其原始文件名

Answer 3

如果你使用than VS Code，必须创建一个名为tsconfig-watch.json的tsconfig.json文件的副本，并更改.vscode文件夹中的task.json文件，如下面的代码。

在tsconfig-watch.json文件中，您必须设置"noEmit"：

    {
        "label": "tsc: watch",
        "type": "typescript",
        "tsconfig": "tsconfig-watch.json", //!important
        "option": "watch",
        "runOptions": {
            "runOn": "folderOpen"
        },
        "problemMatcher": [
            "$tsc-watch"
        ]
    }