Jan Nielsen
Jan Nielsen

Reputation: 11849

import {saveAs} from 'file-saver': CommonJS or AMD dependencies can cause optimization bailouts

After upgrading to Angular 10, my download file-saver saveAs triggers the following compilation warning:

CommonJS or AMD dependencies can cause optimization bailouts.

The compiler also provides a link to an explanation and how to disable the warning. Instead of disabling the warning, is there a ES bundle implementation for the saveAs functionality?

Upvotes: 33

Views: 18377

Answers (4)

nonozor
nonozor

Reputation: 923

Replace :

import * as saveAs from 'file-saver';

By :

import saveAs from 'file-saver';

Upvotes: 0

Larry Guo
Larry Guo

Reputation: 426

Use file-saver-es instead.

npm install -S file-saver-es

Then in your code import saveAs and other codes keep as before.

import { saveAs } from 'file-saver-es';

and if you're using typescript add following to your tsconfig:

"paths": {
      "file-saver-es": [
        "@types/file-saver"
      ]
    } 

Upvotes: 31

Ε Г И І И О
Ε Г И І И О

Reputation: 12371

I tried everything but nothing worked. So decided to shut angular up.

I added file-saver as an allowed commonjs dependancy in angular.json file.

"allowedCommonJsDependencies": ["file-saver"],

That goes in projects->architect->build->options.

Upvotes: 8

Ammaar Patel
Ammaar Patel

Reputation: 176

There is a pull request on file-saver to use es modules but it's almost a year old now so I don't know if it's going to happen. The pull request is here. You could also use the repository of the pull request, but it's behind the original repo. There is also another repo here which is called ngx-filesaver and uses FileSaver.js. I haven't tried it so I don't know if it will fix the issue, or if it is even any good.

Update

I tried ngx-filesaver and it seems to just wrap FileSaver.js in an Angular Module. So whilst it gives you a service to use which is more inline with the rest of your angular code, it doesn't deal with the commonJS or AMD dependency warning.

Upvotes: 5

Related Questions