"This syntax requires an imported helper but module 'tslib' cannot be found" with ES2015 modules
TypescriptTypescript 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:
- 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)
- Select "TypeScript: Select TypeScript Version..."
- 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