在一个create-react-app的typescript项目中，我试着写这个，只是为了快速测试一些东西:
// experiment.test.ts
it('experiment', () => {
console.log('test');
});
但它给了我以下错误，在它下面有一个红色的弯弯曲曲:
当提供了'——isolatedModules'标志时，所有文件都必须是模块。
然而，如果我将文件更改为如下所示，那么一切显然都很好(当然，除了未使用的导入):
// experiment.test.ts
import { Component} from 'react'; // literally anything, don't even have to use it
it('test', () => {
console.log('test');
});
为什么?这里发生了什么?——isolatedModules实际上意味着什么?
当前回答
以防你不想添加不必要的东西
export {}
到处都是，不想破坏其他文件的编译器选项。
如果您有一个单独的tests/目录，您可以扩展根目录tsconfig文件，并在tests/目录中创建一个新文件。
然后加上这个:
{
"extends": "../tsconfig.json",
"compilerOptions": {
"isolatedModules": false
},
}
这只会关闭测试文件的isolatedModules标志。重新启动代码编辑器以同步更改。
其他回答
在我的例子中添加export {};这还不够。
我在webpack.config.ts文件中遇到了这个错误。错误信息如下所示:
“webpack.config。ts'不能在'——isolatedModules'下编译，因为它被认为是一个全局脚本文件。添加导入、导出或空的“export{}”语句，使其成为模块。
当我添加export {};我得到了另一个错误:
SyntaxError:意外的令牌“导出” 编译函数(node:vm:352:18)…
我尝试更改tsconfig。Json模块选项:
{
"compilerOptions": {
"module": "EsNext",
"isolatedModules": true
},
to:
{
"compilerOptions": {
"module": "CommonJS",
"isolatedModules": true
},
因为webpack.config.ts有commonjs的语法，比如module。出口={}。不幸的是，它也没有起作用。我发现没有类型定义添加到项目中，所以我运行:
npm install --save-dev ts-node @types/node @types/webpack
一切都很好。由于export{};，该文件被识别为模块。
当然，使用export {};使文件成为模块只是一种变通方法，而不是解决方案。我可以
change webpack.config file extension to .js instead of .ts and stay with the commonJS module format change to import/export statements in ES modules format and use the .mjs file extension, because Node.js has stable support for ES modules since version 13.2.0 was introduced. Nevertheless, that would trigger other problems with changing commonJS syntax Can I use as es-modules for webpack config? leave .ts file extension, follow the webpack configuration guide for typescript and use ES modules link
我选择了第三个选项，不得不添加导入'webpack-dev-server';避免类型错误。我的配置改变如下:
export {};
const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const webpack = require('webpack');
module.exports = (env) => {...}
:
import * as path from 'path';
import * as webpack from 'webpack';
import 'webpack-dev-server';
import HtmlWebpackPlugin from 'html-webpack-plugin';
const config = (env: { [x: string]: any; }): webpack.Configuration => {...}
export default config;
正确的方法是告诉TypeScript你想要什么。如果你不想要isolatedModules，创建tsconfig。Json到你的测试目录，并添加:
{
"extends": "../tsconfig.json",
"compilerOptions": {
"isolatedModules": false
},
}
添加“isolatedModules”:配置为true，然后通过添加空的export{}来欺骗TypeScript检查器，让我觉得代码很糟糕。
Typescript将没有导入/导出的文件视为遗留脚本文件。因为这样的文件不是模块，它们的任何定义都被合并到全局命名空间中。isolatedModules禁止这样的文件。
向文件添加任何导入或导出都可以使其成为模块，错误就会消失。
export{}也是一种不需要导入任何东西就能使文件成为模块的方便方法。
尽管你从“错误文件”中导出东西，仍然有错误?
检查您是否导出了已经在另一个文件中导出的相同名称(冲突) 在你修复后，尝试停止并启动你的npm/yarn runner(我经历过即使在硬重载页面后，特别是当你在其他地方有另一个错误时，它也不能恢复自己)
这是因为您还没有导入要测试的函数。一旦你这样做了，错误就会消失。公认的答案解释了其中的原因。
