[英]Angular2 - Importing 3rd party javascript in SystemJS
由于某种原因,fileSaver没有被映射。 angular2-jwt工作正常。
我做了npm install file-saver -save
来获取文件保护程序,然后按如下方式引用了它(我有一个gulp任务,将js文件移动到libs目录,我在那里看到文件)
在index.html中,我已将脚本包含在src和system.config中
<script src="libs/file-saver/FileSaver.js"></script>
<!-- 2. Configure SystemJS -->
<script>
System.config({
packages: {
app: {
format: 'register',
defaultExtension: 'js'
}
} ,
map: {
"angular2-jwt": "libs/angular2-jwt/angular2-jwt.js"
,"fileSaver":"libs/file-saver/FileSaver.js"
}
});
System.import('app/bootstrap')
.then(null, console.error.bind(console));
</script>
component.ts
在这里找不到fileSaver
import {SaveAs} from 'fileSaver';
我得到的错误是这个
error TS2307: Cannot find module 'fileSaver'.
知道这里有什么问题吗?
就我而言,它是这样工作的:
package.json :
"dependencies": {
// ... all angular dependencies
"file-saver": "1.3.2"
},
index.html :
<!-- all angular dependencies and other 3rd party -->
<script src="node_modules/file-saver/FileSaver.js"></script>
Types.json :
// other typings needed
"filesaver": "github:DefinitelyTyped/DefinitelyTyped/FileSaver/FileSaver.d.ts#d21f1bd1fd079bbc18bc88ed71d2be7f5707e33a"
用法 :
var blob = new Blob([this.response], {type: 'application/zip'});
saveAs(blob, 'project.zip');
您需要先执行npm install
然后再运行它。
就是这样,希望对您有所帮助。
这不会让您
import {SaveAs} from 'fileSaver';
也没有完整的代码完成,但至少可以正常工作
已安装库和类型(@types)。 然后,
import {saveAs} from 'file-saver';
工作了。 另外,我必须在System JS配置中将File-Saver的模块格式明确设置为cjs:
"packages":{
"file-saver":{
"main":"FileSaver.js",
"format": "cjs"
}
}
据我了解,SystemJS默认会将文件存储识别为AMD模块。 文件保存程序中的AMD模块定义可能有问题,但是我对此并不十分了解。 (另请参阅https://github.com/eligrey/FileSaver.js/blob/master/FileSaver.js#L182 )
如果不设置cjs模块格式,则在运行时会出现“ fileSaver.saveAs不是函数”的情况。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.