为什么任何导入都会修复--isolatedModules错误?


139

在create-react-app打字稿项目中,我尝试编写此代码只是为了快速测试一些内容:

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

但这给了我以下错误,下面是一个红色的波浪形it

提供“ --isolatedModules”标志时,所有文件都必须是模块。

但是,如果我将文件更改为以下文件,那么一切似乎都很好(当然,除了未使用的导入外):

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

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

为什么?这是怎么回事 --isolatedModules实际上是什么意思?


如果您使用import或,export则该文件为ES6模块。您的最高示例是有问题的,因为it它没有在任何地方定义,在模块化体系结构中,您需要it从某个地方导入
apokryfos

Answers:


267

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

将任何导入或导出添加到文件都会使它成为一个模块,并且错误会消失。

export {}也是将文件制作为模块而无需导入任何内容的便捷方法


谢谢,很简单,但是当您创建第一个测试时,您会为错误感到困惑。
JuanguiJordán20年

2
@JuanguiJordán太容易了,所以错了。如果您不想isolatedModules将它们设置为false
Wojciech Bednarski '20年

感谢@WojciechBednarski,但您能否详细说明您的答案?
JuanguiJordán20年

2
@JuanguiJordán好吧,这就像添加一些规则,然后通过添加忽略它@ts-ignore。该export {}仅仅是一个不同的语法,绕过规则的方式,但原则上正是如此。
Wojciech Bednarski '20年

2
我认为有99%的时间都遵循通用规则的问题,但这有时需要打破。只要必须遵守规则,就必须“打破规则”,这迫使我思考自己在做什么,并考虑是否有更好的方法来解决问题。有时没有。就像在这种情况下,我只是制作一个测试文件来尝试一些东西。
Svish

25

正确的方法是告诉TypeScript您想要什么。如果您不想在目录中isolatedModules创建并添加:tsconfig.jsontest

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

添加"isolatedModules": true到配置中,然后通过添加空白来欺骗TypeScript检查器,这export {}对我来说是不好的代码。


如其他评论所述,在这种特殊情况下,它不会被视为代码异味,在这里是必须的,因为没有其他方法可以将部分文件从isoolulatedModules规则中部分排除
Akshay Vijay Jain

不能将读取对象的唯一属性“isolatedModules“#<OBJECT>”在verifyTypeScriptSetup:嗯,当时我FROB时真亦假,有人告诉我回答:类型错误
杰里舍

@JerryAsher这里的人是一样的,但是它可以更早地工作,然后我还原了一些代码并尝试运行它,这是当我得到完全相同的错误时。
Ganesh Kumar


1

让我们尝试检查隔离的模块。当我检查Google时,没有直接的上下文。

这基本上意味着您允许Typescript隔离编译模块。

但是它来自Typescript,并且与Typescript优先考虑模块而不是名称空间有关。

模块还依赖于模块加载器(例如CommonJs / Require.js)或支持ES模块的运行时。模块提供了更好的代码重用性,更强的隔离性以及对捆绑的更好工具支持。

来源1

使用create-react-app打字稿项目,您应该已经安装了typescript和ts-jest(或者create-react-app应该根据您是否退出应用程序来处理依赖项)。

ts-jest有一些相关信息:

缺省情况下,ts-jest在项目上下文中使用TypeScript编译器(您自己),并具有完整的类型检查和功能。但是它也可以用来分别编译每个文件,TypeScript称之为“隔离模块”。这就是isolatedModules选项(默认为false)的作用。

来源2

一旦使用该export命令,就会从导出的内容中创建一个模块。

如果您使用的是ts-jest,则可以添加这些设置而不会影响其他模块,这些模块将由create-react-app组成。

"ts-jest": {
  "isolatedModules": false
}

并检查ts-jest页面(第二来源)的赞成意见和反对意见。

By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.