导入{saveAs} from 'file-saver': CommonJS或AMD依赖可能导致优化失败。

Question

在升级到 Angular 10 后，我的下载 file-saver saveAs 触发了以下编译警告：

CommonJS or AMD dependencies can cause optimization bailouts.

编译器还提供了一个解释的链接和如何禁用该警告的方法。除了禁用警告外，是否有一个 ES bundle 实现saveAs功能？

- Jan Nielsen

Answer 1

请使用 file-saver-es 替代。

npm install -S file-saver-es

然后在您的代码中导入saveAs和其他代码保持不变。

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

如果您正在使用TypeScript，请将以下内容添加到您的tsconfig中：

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

- Larry Guo

---

没有@types/file-saver-es。 - Mikhail Orlov

@MikhailOrlov请注意关于这个编辑的内容！ - Matthieu Riegler

@MatthieuRiegler 看起来现在有一个 @types/file-saver-es。 - adamdport

Answer 2

我尝试了所有方法，但都不起作用。所以决定让Angular闭嘴。

我在angular.json文件中添加了file-saver作为一个允许的commonjs依赖项。

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

该设置在项目->架构师->构建->选项中。

- Ε Г И І И О

---

只是不幸地隐藏了警告。 - Brian Reinhold

如果你这样做的话，你将无法升级到Angular 16。 - undefined

Answer 3

文件保存器上有一个拉请求要使用es模块，但现在已经一年了，所以我不知道它是否会发生。拉请求在这里。您还可以使用拉请求的存储库，但它落后于原始存储库。 还有另一个存储库，名为ngx-filesaver，使用FileSaver.js。我没有尝试过，所以我不知道它是否能解决问题，或者是否好用。

更新

我尝试了ngx-filesaver，它似乎只是在Angular模块中包装FileSaver.js。因此，虽然它提供了一个服务供您使用，该服务更符合您的Angular代码的其他部分，但它无法处理commonJS或AMD依赖项警告。

- Ammaar Patel