简体   繁体   English

使用 ES2015 模块时出现“此语法需要导入的帮助程序,但找不到模块‘tslib’”

[英]"This syntax requires an imported helper but module 'tslib' cannot be found" with ES2015 modules

I have demo project I'm about to compile to ES5 with ES2015 modules enabled and tslib used for external TS helpers:我有一个演示项目,我将要编译为 ES5,启用 ES2015 模块并将tslib用于外部 TS 助手:

package.json包.json

{
  "name": "foo",
  "scripts": {
    "build": "tsc"
  },
  "dependencies": {
    "tslib": "^1.9.3"
  },
  "devDependencies": {
    "typescript": "^3.1.3"
  }
}

tsconfig.json tsconfig.json文件

{
  "compilerOptions": {
    "target": "es5",
    "module": "es2015",
    "outDir": "./lib",
    "rootDir": "./src",
    "importHelpers": true,
    "strict": true,
    "experimentalDecorators": true
  }
}

src/index.ts源代码/index.ts

function a(target: any) {
    return target;
}

@a
export class Foo {}

This results in an error:这会导致错误:

src/index.ts:5:1 - error TS2354: This syntax requires an imported helper but module 'tslib' cannot be found. src/index.ts:5:1 - 错误 TS2354:此语法需要导入的帮助程序,但找不到模块“tslib”。

While lib/index.js is correctly compiled:lib/index.js被正确编译时:

import * as tslib_1 from "tslib";
function a(target) {
    return target;
}
var Foo = /** @class */ (function () {
    function Foo() {
    }
    Foo = tslib_1.__decorate([
        a
    ], Foo);
    return Foo;
}());
export { Foo };

How can this problem be solved?如何解决这个问题?

Try something like:尝试类似:

npm install tslib --save-dev

Or, to fix noob mistake (which I just made):或者,修复菜鸟错误(我刚刚犯的):

npm i

I mean, personally before signing off on Friday, I did a git clean -fxd , but no npm i , so all the npm packages were missing.我的意思是,在周五签字之前,我个人做了一个git clean -fxd ,但没有npm i ,所以所有的 npm 包都丢失了。 Doh多哈

The problem for me was that the editor was using a different TypeScript version than the project.我的问题是编辑器使用的 TypeScript 版本与项目不同。

To fix that:要解决这个问题:

  1. Open Command Palette (Cmd+Shift+P on Mac. Focused file must be.ts or.tsx otherwise it won't show the option to change version)打开命令面板(Mac 上的 Cmd+Shift+P。焦点文件必须是 .ts 或 .tsx 否则不会显示更改版本的选项)
  2. Select "TypeScript: Select TypeScript Version..." Select “打字稿:Select TypeScript 版本...”
  3. It shows VSCode's TS version and Workspace's (project) one, pick that one它显示了 VSCode 的 TS 版本和 Workspace 的(项目)一个,选择那个

Or click on the version number at the bottom bar if it shows in there:或者单击底部栏中的版本号(如果它显示在其中):

Add below lines to tsconfig.json将以下行添加到tsconfig.json

"compilerOptions": {
    //...rest parameters

    "baseUrl": "./",
    "paths": {
      "tslib" : ["path/to/node_modules/tslib/tslib.d.ts"]
    },

Just updated tslib to latest version, and problem had been fixed.刚刚将 tslib 更新到最新版本,问题已经解决。 I had installed 1.9.3 , and updated to 1.10.0 .我已经安装了1.9.3 ,并更新到1.10.0

As the reference states, module resolution is set to Node mode only for "modules": "commonjs" , and is set to classic mode for "modules": "es2015" :参考所述,模块分辨率仅针对"modules": "commonjs"设置为节点模式,并为 " "modules": "es2015" ": "es2015" 设置为经典模式:

There are two possible module resolution strategies: Node and Classic.有两种可能的模块解析策略:Node 和 Classic。 You can use the --moduleResolution flag to specify the module resolution strategy.您可以使用 --moduleResolution 标志来指定模块解析策略。 If not specified, the default is Classic for --module AMD |如果未指定,则默认为 Classic for --module AMD | System |系统 | ES2015 or Node otherwise ES2015 或 Node 其他

Since classic mode is unaware of node_modules , the compiler cannot resolve tslib module.由于经典模式不知道node_modules ,编译器无法解析tslib模块。

moduleResolution should be set explicitly for ES2015 modules: moduleResolution应该为 ES2015 模块显式设置:

...
"module": "es2015",
"moduleResolution": "node",
...

My error appeared to be sporadic but likely caused by editing a file in the "node_modules" folder.我的错误似乎是零星的,但可能是由编辑“node_modules”文件夹中的文件引起的。

I deleted我删除了

  • "node_modules" folder “node_modules”文件夹
  • "package-lock.json" file “package-lock.json”文件

Ran... "npm install"然...“npm安装”

It is now working.它现在正在工作。

NOTE: I tried running "npm install' prior to deleting the files and that did not solve the issue.注意:我尝试在删除文件之前运行“npm install”,但这并没有解决问题。

In my case, tslib was already installed and i was seeing this error only for 1 component while everything else was working fine - build and functionality.就我而言,已经安装了 tslib,我只看到 1 个组件出现此错误,而其他一切工作正常 - 构建和功能。 I just restarted my vscode and it vanished.我刚刚重新启动了我的 vscode,它就消失了。 So, try that if the error is still there after you have done things which others have suggested.因此,请尝试在您完成其他人建议的操作后错误仍然存​​在。

update the dependencies and devDependencies of tslib in package.json更新package.json中tslib的依赖和devDependencies

{
   dependencies:{
     "tslib": "1.10.0",
   },
   devDependencies:{
     "tslib": "1.10.0",
   }
}

In my case the error Cannot find module 'tslib' was caused by special builder @nrwl/node:build in my Angular repository (I'm using nrwl/nx monorepo pattern with NodeJS server as one of the applications).在我的情况下,错误Cannot find module 'tslib'是由我的 Angular 存储库中的特殊构建器@nrwl/node:build引起的(我正在使用带有 NodeJS 服务器的nrwl/nx monorepo 模式作为应用程序之一)。

It didn't include tslib in the compilation output.它没有在编译 output 中包含tslib Setting "externalDependencies": "none" in the production build configuration in angular.json solved the issue.angular.json的生产构建配置中设置"externalDependencies": "none"解决了该问题。 Credit goes to @vincastl here: https://github.com/nrwl/nx/issues/2625归功于@vincastl: https://github.com/nrwl/nx/issues/2625

Posting it here as it was the first post I found trying to solve this issue, perhaps I'm not alone.在这里发布它,因为这是我发现尝试解决此问题的第一篇文章,也许我并不孤单。

npm i -g tslib

This solved my problem.这解决了我的问题。 Without -g it didn't work for me.没有 -g 它对我不起作用。

npm install npm安装

If you see this error the first time you open a new project or repository, you probably simply haven't installed the app's required modules yet.如果您在第一次打开新项目或存储库时看到此错误,则可能只是尚未安装应用程序所需的模块。

In the directory of the app, run:在应用程序的目录中,运行:

npm install

In my case removing or setting the importHelpers compiler option to false resolved the issue.在我的情况下,删除importHelpers编译器选项或将其设置为false解决了这个问题。

{
  "compilerOptions": {
    ...
    "importHelpers": false, // Or remove this
    ...
  }
}

In your project, simply run在您的项目中,只需运行

npm i tslib 

It contains all the typescript helper functions它包含所有 typescript 辅助函数

在你的项目中执行: npm install --force

upgrading tslib version 2.00.0升级 tslib 版本 2.00.0

in package.json it should be "tslib": "^2.0.0"在 package.json 它应该是 "tslib": "^2.0.0"

I had a case, where the only fix was to add this manually in package.json :我有一个案例,唯一的解决方法是在package.json中手动添加:

"tslib": "^2.3.1",

and run npm i afterwards.然后运行npm i

I faced this issue with jest (+vuejs and a monorepo structure).我用jest (+vuejs 和 monorepo 结构)遇到了这个问题。 All the app works fine, but the unit tests.所有应用程序都运行良好,但单元测试。

So 2 things has to be done to make them work:因此,必须做两件事才能使它们起作用:

  1. in tsconfig.json :tsconfig.json中:
    "compilerOptions": {
      "paths": {
        "tslib" : ["path/to/node_modules/tslib/tslib.d.ts"]
    }
  1. in jest.config.js :jest.config.js中:
    moduleNameMapper: {
      'tslib': '<rootDir>/path/to/node_modules/tslib/tslib.js'
    }

I was facing the same problem and it got resolved using following command!我遇到了同样的问题,使用以下命令解决了!

npm install -D tslib@latest npm install -D tslib@latest

You have to remove from "compilerOptions": { "importHelpers": true, } on tsconfig.json你必须从"compilerOptions": { "importHelpers": true, }中删除 tsconfig.json

Add this below line in your.csproj file inside <PropertyGroup> :<PropertyGroup>内的 your.csproj 文件中添加以下行:

<TypeScriptCompileBlocked>True</TypeScriptCompileBlocked>

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 TypeScript 错误“TS2354:此语法需要导入的帮助程序,但找不到模块‘tslib’” - TypeScript error "TS2354: This syntax requires an imported helper but module 'tslib' cannot be found" ES2015 模块语法优于自定义 TypeScript 模块和命名空间 @typescript-eslint/no-namespace #2 - ES2015 module syntax is preferred over custom TypeScript modules and namespaces @typescript-eslint/no-namespace #2 ES2015 模块语法优于自定义 TypeScript 模块和命名空间@typescript-eslint/no-namespace - ES2015 module syntax is preferred over custom TypeScript modules and namespaces @typescript-eslint/no-namespace 在没有模块加载器的情况下在 TypeScript 中使用 ES2015 模块 - Using ES2015 Modules In TypeScript Without A Module Loader 使用Gulp将ES2015 / CommonJS模块压缩为一个CommonJS模块 - Condense ES2015/CommonJS Modules to One CommonJS Module with Gulp 用 ES2015 模块替换 TypeScript 命名空间 - Replace TypeScript namespaces with ES2015 modules 重构 TypeScript 代码,声明合并到 ES2015 模块语法 - Re-factor TypeScript code with declaration merging to ES2015 module syntax 为什么 ES2015 模块语法优于自定义 TypeScript 命名空间? - Why the ES2015 module syntax is preferred over custom TypeScript namespaces? 如何使用es2015模块中提供的导入库运行Jest测试? (Jest遇到意外的令牌错误) - How can I run Jest tests with an imported library that is made available in es2015 modules? (Jest encountered unexpected token error) 打字稿你用&#39;es2015`模块导入`lodash`吗? - Typescript do you import `lodash` — with `es2015` modules?
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM