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

Question

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?

Answer 1

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';

Answer 2

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.