AlexKibo88
AlexKibo88

Reputation: 827

Import JSZip in Angular 2 project

I am having troubles while importing the JSZip library in my Angular 2 project. I followed the following steps in order to change the project configuration:

1 - Install JSZip using NPM

npm install jszip --save

2 - Change systemjs.config.js as follows

var map = {
    ...
    'jszip':                      'node_modules/jszip/dist/jszip.min.js'
};

3 - Import the dependency within the component that requires it

import JSZip from 'jszip';

Then, I tried using the main JSZip constructor to attach some files, but I am getting a web error stating that the constructor is not defined. Besides, the Typescript editor I am using is not able to find the definition for it.

Did I miss something?

Thank you.

Upvotes: 20

Views: 28834

Answers (3)

Hua Thi Le
Hua Thi Le

Reputation: 21

With the current JSZip version (3.10.1), we need to use this command:

import JSZip from 'jszip';

then use:

let zipFile: JSZip = new JSZip();

After google for a while, I had to read the typescript code of JSZip to find out this. Hope this will help someone else.

Upvotes: 2

AlexKibo88
AlexKibo88

Reputation: 827

For those who want to know how it ended, the problem was in the import. The following is the correct import:

import * as JSZip from 'jszip';

Then, it is used as follows:

let zipFile: JSZip = new JSZip();

Upvotes: 48

Yunfei Li
Yunfei Li

Reputation: 121

There is a typo and it should be:

import * as JSZip from 'jszip';
let zipFile: JSZip = new JSZip();

Upvotes: 4

Related Questions