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

Typescript

Typescript Problem Overview


I have demo project I'm about to compile to ES5 with ES2015 modules enabled and tslib used for external TS helpers:

package.json

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

tsconfig.json

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

src/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.

While lib/index.js is correctly compiled:

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?

Typescript Solutions


Solution 1 - Typescript

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. Doh!

Solution 2 - Typescript

The problem for me was that the editor was using a different TypeScript version than the project.

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)
  2. Select "TypeScript: Select TypeScript Version..."
  3. It shows VSCode's TS version and Workspace's (project) one, pick that one

Or click on the version number at the bottom bar if it shows in there:

Solution 3 - Typescript

Add below lines to tsconfig.json

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

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

Solution 4 - Typescript

Just updated tslib to latest version, and problem had been fixed. I had installed 1.9.3, and updated to 1.10.0.

Solution 5 - Typescript

As the reference states, module resolution is set to Node mode only for "modules": "commonjs", and is set to classic mode for "modules": "es2015":

> There are two possible module resolution strategies: Node and Classic. You can use the --moduleResolution flag to specify the module resolution strategy. If not specified, the default is Classic for --module AMD | System | ES2015 or Node otherwise

Since classic mode is unaware of node_modules, the compiler cannot resolve tslib module.

moduleResolution should be set explicitly for ES2015 modules:

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

Solution 6 - Typescript

My error appeared to be sporadic but likely caused by editing a file in the "node_modules" folder.

I deleted

  • "node_modules" folder
  • "package-lock.json" file

Ran ... "npm install"

It is now working.

NOTE: I tried running "npm install' prior to deleting the files and that did not solve the issue.

Solution 7 - Typescript

update the dependencies and devDependencies of tslib in package.json

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

Solution 8 - Typescript

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. I just restarted my vscode and it vanished. So, try that if the error is still there after you have done things which others have suggested.

Solution 9 - Typescript

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).

It didn't include tslib in the compilation output. Setting "externalDependencies": "none" in the production build configuration in angular.json solved the issue. Credit goes to @vincastl here: 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.

Solution 10 - Typescript

npm i -g tslib

This solved my problem. Without -g it didn't work for me.

Solution 11 - Typescript

npm install

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

Solution 12 - Typescript

In your project , simply run

npm i tslib 

It contains all the typescript helper functions

Solution 13 - Typescript

upgrading tslib version 2.00.0

in package.json it should be "tslib": "^2.0.0"

Solution 14 - Typescript

I had a case, where the only fix was to add this manually in package.json :

"tslib": "^2.3.1",

and run npm i afterwards.

Solution 15 - Typescript

In my case removing or setting the importHelpers compiler option to false resolved the issue.

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

Solution 16 - Typescript

Add this below line in your .csproj file inside <PropertyGroup>:

<TypeScriptCompileBlocked>True</TypeScriptCompileBlocked>

Solution 17 - Typescript

Execute in the your project: npm install --force

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionEstus FlaskView Question on Stackoverflow
Solution 1 - TypescriptPaul LockwoodView Answer on Stackoverflow
Solution 2 - TypescriptzokView Answer on Stackoverflow
Solution 3 - TypescriptDivansh SachdevaView Answer on Stackoverflow
Solution 4 - TypescriptPavelView Answer on Stackoverflow
Solution 5 - TypescriptEstus FlaskView Answer on Stackoverflow
Solution 6 - Typescriptuser2032View Answer on Stackoverflow
Solution 7 - TypescriptblazehubView Answer on Stackoverflow
Solution 8 - TypescriptA. GuptaView Answer on Stackoverflow
Solution 9 - TypescriptAlexey GrinkoView Answer on Stackoverflow
Solution 10 - TypescriptilyasView Answer on Stackoverflow
Solution 11 - TypescriptTony BrasunasView Answer on Stackoverflow
Solution 12 - TypescriptsuperdwaleView Answer on Stackoverflow
Solution 13 - TypescriptChinthakaView Answer on Stackoverflow
Solution 14 - TypescriptT.ToduaView Answer on Stackoverflow
Solution 15 - TypescriptfortuneeView Answer on Stackoverflow
Solution 16 - TypescriptEugine Santhana Sagayam ManuelView Answer on Stackoverflow
Solution 17 - TypescriptRafael N. SiqueiraView Answer on Stackoverflow