为什么- isolatedModules错误会被任何导入修复？

Question

在一个create-react-app typescript项目中，我试图编写这个只是为了快速测试一些东西:

// experiment.test.ts
it('experiment', () => {
  console.log('test');
});

但它给了我以下错误，下面有一个红色的波浪线：

当提供'-隔离模块'标志时，所有文件都必须是模块。

但是，如果我将文件更改为以下内容，那么一切显然都很好（当然除了未使用的导入）：

// experiment.test.ts
import { Component} from 'react'; // literally anything, don't even have to use it

it('test', () => {
  console.log('test');
});

为什么？这里发生了什么事？< code> - isolatedModules实际上是什么意思/做什么？

Answer 1

尽管您从“错误文件”导出了内容，但仍有错误？

1. 检查您是否没有导出已在另一个文件中导出的相同名称（冲突）
2. 修复后尝试停止并启动您的npm/的纱线转轮（我经历了它不能恢复自己，即使在硬重新加载的页面，特别是当你有另一个错误在其他地方）

Answer 2

正确的方法是告诉TypeScript你想要什么。如果您不想＜code＞isolatedModules＜/code＞创建＜code＞tsconfig。json在test目录中，并添加：

{
  "extends": "../tsconfig.json",
  "compilerOptions": {
    "isolatedModules": false
  },
}

添加“隔离模块”：对配置为 true，然后通过添加空导出 {} 来欺骗 TypeScript 检查器，这对我来说闻到了糟糕的代码。

Answer 3

Typescript将没有导入/导出的文件视为旧脚本文件。因此，这些文件不是模块，它们的任何定义都会合并到全局命名空间中isolatedModules禁止此类文件。

将任何导入或导出添加到文件将使其成为模块，错误将消失。

此外，< code>export {}是一种不用导入任何东西就能使文件成为模块的简便方法。