the syntax requires an imported helper named __spreadArrays

Question

When I'm trying to use spreading in typescript like:

.reduce((unique, x) => {
    unique.some(element => element.machineName === x.machineName) ? unique : [...unique, x];
}

I get warning with red marking from Visual Studio Code:

the syntax requires an imported helper named __spreadArrays

typescript version: "2.3.4"
target: "es5"

I think in later versions this issue is fixed, but right now I can't migrate. How can I fix it?

Note: Project gets compiled fine and works. But red underlying in VS Code in annoying.

It looks like VS Code is set to target es5 instead of es6? Haven't seen that before, maybe check out this thread: https://stackoverflow.com/questions/29953293/is-there-a-way-to-turn-on-es6-es7-syntax-support-in-vscode — beznet, Oct 10 '19 at 18:46

score 89 · Answer 1 · answered Jun 30 '21 at 05:14

89

In my case the problem it was target: "es5" in compilerOptions at tsconfig.json.

So I change it to es6 to get it works without adding dependency.

answered Jun 30 '21 at 05:14

yacth_Mon

999
1
7
6

I really think this is a more relatable answer. `tsLib` is rarely directly installed in projects. – RazorHead Jan 07 '22 at 13:54

Jacob-Jan Mosselman · Answer 2 · 2021-09-15T13:30:16.770

47

Quick fix, short answer

npm install tslib@latest --save

Update

I got this issue again (now with tslib version 2.2.0) after updating VS Code, again updating fixed the issue.

Original

I had this issue with tslib version 1.14.1

npm update tslib --save didn't really do anything

npm install tslib@latest --save did the job, it updated to version 2.2.0

edited Sep 15 '21 at 13:30

answered May 07 '21 at 13:19

Jacob-Jan Mosselman

801
1
10
18

1

Had the same issue with 1.14.1. I don't know if this is an issue with that specific version (since _spreadArrays is meant to be there since 1.10.0), but installing 2.2.0 seems to be the fix – Jojofoulk May 19 '21 at 06:40
1

this works for me.. i had to restart my vscode.. – Joy Lab Jan 21 '22 at 06:05

Alex Vovchuk · Accepted Answer · 2021-05-15T23:42:33.367

31

For VS Code the notification is based on the tsLib exports. Actually nothing bad happens without doing anything, it is just lack of typing.

Solution: Update tsLib dependency to get rid of the highlighting. In my case it was version 1.9.0. Update to 1.10.0 solved the issue.

__spreadArrays is added in 1.10.0 tsLib version: https://github.com/microsoft/tslib/blob/1.10.0/tslib.es6.js

Update: Since some time passed, it is better to update version to 2.2.0 (based on last comments) or the latest.

edited May 15 '21 at 23:42

answered Dec 19 '19 at 21:00

Alex Vovchuk

2,828
4
19
40

What does update tslib dependency mean? Add it to package.json, to development dependencies or to devDependencies? – tkit Mar 13 '21 at 18:14
8

`npm install tslib --save` did the job for me – Luuk Mar 16 '21 at 06:01

score 29 · Answer 4 · answered Jun 28 '21 at 02:08

29

Assuming your tslib is installed correctly and up to date, you might still get this error in VS Code if the editor is using a different Typescript version.

(taken from zok's answer on this SO question)

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 the workspace one

answered Jun 28 '21 at 02:08

everythinginplace

421
4
3

This is the only valid answer, since the question refers to a problem with vs code, supposing that the build would succeed – Christian Vincenzo Traina Nov 03 '22 at 10:32

score 8 · Answer 5 · answered Sep 29 '21 at 14:18

8

This error might happen if you have in your tsconfig.json file :

{ 
  "importHelpers": true,
  "target": "es5"
}

If for any reason you can't upgrade to es6, setting importHelpers to false will make the error go away ...

answered Sep 29 '21 at 14:18

Etienne Coumont

518
7
11

One reason in my case is that the third party API I use instantiates objects without the word "new". – horiatu Feb 25 '22 at 15:12

score 2 · Answer 6 · answered Apr 13 '22 at 04:24

2

from right side down hover on curly braces beside of TypeScript and then click on version it will give you few options, generally related to project just select version and it will work fine

answered Apr 13 '22 at 04:24

asifaftab87

1,315
24
28

1

Brilliant. The simplest solution of all. Thanks! – ollalla Jun 20 '23 at 17:32

score 1 · Answer 7 · answered Sep 20 '21 at 12:44

1

for yarn users: yarn upgrade tslib@latest

answered Sep 20 '21 at 12:44

Itay Tur

683
1
15
40

score 0 · Answer 8 · answered May 07 '21 at 09:33

0

you may need to upgrade to tslib@2.2.0

answered May 07 '21 at 09:33

user2734839

207
3
7

score 0 · Answer 9 · answered Jun 19 '21 at 19:03

0

Just make sure tslint is enabled in the bottom of vscode editor options

answered Jun 19 '21 at 19:03

pratyush choudhary

11
5

score 0 · Answer 10 · answered May 11 '22 at 11:07

0

Ran into this issue with a dependency and resolved it by updating its tsconfig.ts with the path to the top level lastest tslib.

"importHelpers": true,
"paths": {
  "tslib": [ "../tslib/tslib.d.ts" ]
}

answered May 11 '22 at 11:07

kevwig85

53
5

the syntax requires an imported helper named __spreadArrays

10 Answers10

Quick fix, short answer

Update

Original

Linked