首页 文章

获取外部JS库以用于Angular 2

提问于
浏览 次
2

我正努力让FileSaver在我的项目中工作 . 这是我采取的确切步骤

  • npm install filesaver.js --save

  • 在app.component.ts内

从'filesaver.js'导入*作为FileSaver;

然后我得到这个错误

找不到模块'filesaver.js' .

我还尝试将以下内容添加到我的angular-cli.json文件中

"scripts": [
    "../node_modules/filesaver.js/FileSaver.min.js"
  ]

This是我能找到的最接近的东西 . 但是，这个家伙和我有不同的设置 . 必须有一个简单的方法来使用这个文件吗？

注意，从npm安装FileSaver后，在我的node-module中，我得到filesaver.js文件夹（不知道为什么他们将.js作为文件夹名称） . 在这个文件夹中，我得到了FileSaver.js和FileSaver.min.js

我也试过了

从'filesaver.js / FileSaver.min.js'导入*作为FileSaver;

但那只是给了我

找不到模块'filesaver.js / FileSaver.min.js' . ）

----更新---

我也尝试过typings file

npm i @types/filesaver

结果是一样的

----更新-----

以下是我如何使用它 .

添加了@ types / filesaver并添加了以下代码 .

declare module 'filesaver' {
    var saveAs: any;
    export = saveAs;
}

注意 . 我正在修改node_module文件中的内容是不是很糟糕 . 这意味着每次用户运行npm install时，自定义代码都不会存在 . 怎么绕过它？

从npm下载的默认文件夹名称是filesaver.js . 我把它改成了filesaver . 为什么在世界上他们将其命名为.js，该程序似乎无法将其识别为文件夹

然后从'filesaver'导入*作为filesaver

然后我可以打电话

var blob = new Blob(['Some Content'], { type: "text/csv;charset=utf-8" });
filesaver.saveAs(blob, "hello world.csv");

-----文件夹结构-----

angular-cli：1.0.0-beta.26节点：6.9.1 os：darwin x64 @ angular / common：2.4.5 @ angular / compiler：2.4.5 @ angular / core：2.4.5 @ angular / forms： 2.4.5 @ angular / http：2.4.5 @ angular / material：2.0.0-beta.1 @ angular / platform-browser：2.4.5 @ angular / platform-browser-dynamic：2.4.5 @ angular / router： 3.4.5 @ angular / compiler-cli：2.4.5

folder structure

angular typescript angular-cli filesaver.js

1 回答

  • 0

    添加到angular-cli（你做了）

    "scripts": [
    "../node_modules/filesaver.js/FileSaver.min.js"
  ]

    然后添加到src / typings.d.ts

    declare function saveAs(data: Blob, filename: string)

    现在您可以使用此方法而无需任何导入 .

    var blob = new Blob(['Some Content'], { type: "text/csv;charset=utf-8" });
saveAs(blob, "hello world.csv");

    这个怎么运作 .

    • 你不应该创建typings.d.ts，它由angular-cli添加，因此它必须位于项目内的 src 文件夹中 .

    • 当您在section script中添加angular-cli.json时，所有脚本都将在页面start上加载 . 这就是为什么包含来自 node_modules 的脚本非常重要的原因"../node_modules/filesaver.js/FileSaver.min.js" . 并且包中添加了 --save 标志，正如您所做的那样，因此删除任何时间文件夹并调用npm install脚本将会到位 . 3 .

    回复于

相关问题