Solvedangular cli Failed to build project with JSZip library

Versions

Angular CLI: 6.0.0
Node: 8.11.1
OS: win32 x64
Angular: 6.0.0
... animations, cli, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.6.0
@angular-devkit/build-angular     0.6.0
@angular-devkit/build-optimizer   0.6.0
@angular-devkit/core              0.6.0
@angular-devkit/schematics        0.6.0
@ngtools/webpack                  6.0.0
@schematics/angular               0.6.0
@schematics/update                0.6.0
rxjs                              6.1.0
typescript                        2.7.2
webpack                           4.6.0

Repro steps

  • ng new jszip-test
  • cd .\jszip-test\
  • npm i --save jszip
  • Add the following code in app.component.ts:
import * as JSZip from 'jszip';
...
constructor() {
    const zip = new JSZip();
}
  • ng build

Observed behavior

ERROR in ./node_modules/jszip/lib/readable-stream-browser.js
Module not found: Error: Can't resolve 'stream' in 'C:\dev\jszip-test\node_modules\jszip\lib'

Desired behavior

Should be able to build a project without errors.

Mention any other details that might be useful (optional)

This works as expected with angular-cli 1.7

41 Answers

✔️Accepted Answer

npm i stream - worked for me

Other Answers:

My short fix:
node_modules/jszip/lib/readable-stream-browser.js

module.exports = require("readable-stream");

It was hot fix.
Right fix:
tsconfig.json

{
  "compileOnSave": false,
  "compilerOptions": {
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "target": "es5",
    "typeRoots": [
      "node_modules/@types"
    ],
    "paths": {
      "jszip": [
        "../node_modules/jszip/dist/jszip.js"
      ]
    },
    "lib": [
      "es2017",
      "dom"
    ]
  }
}

I have the same error message with ng serve.

More Issues: