如何使用JSPM使用缩小的第三方Javascript文件

Question

我的应用程序使用JSPM和SystemJS进行模块加载,并使用angular.

我的config.js文件有角度图,如:

"angular": "github:angular/bower-angular@1.5.8"

所以,当我这样做时import angular from 'angular',我从config.js文件中指定的Path获取angular.js 文件.非常好.

现在要求是我想在应用程序中使用缩小的第三方javascript文件(angular.min.js).但是jspm 注册表中没有缩小的文件
所以我的应用程序的初始加载时间很长,因为有很多大文件,例如angular.js,browser.js等需要花费太多时间来加载.

我知道,我可以做一个jspm bundle递归缩小所有依赖文件,包括供应商的文件.但我的问题是:

1 -是否可以直接使用JSPM的供应商缩小文件(angular.min.js)？使用供应商的缩小文件而不是将它们缩小为自己是好的,不是吗？

2 -如果上面的一个不可能,那么我如何只捆绑我的应用程序特定文件并仍然能够使用(单独捆绑)minified angular.js文件？

这里推荐的方法是什么？

Answer 1

在 config.js 文件中，您可以映射任何具有名称的文件，并由 SystemJs 在浏览器中导入它

所以你可能会做类似的事情

"angular": "jspm_packages/...../angular.min" （文件的路径）

但是，建议的方法是捆绑并缩小所有供应商文件，并且正如您所提到的，单独捆绑应用程序特定的文件

您可以使用 Gulp 或 Grunt 之类的工具来生成这两个文件

网上有很多关于如何执行此操作的示例，但这里有一个可以帮助您入门的示例 https://blog.dmbcllc.com/using-gulp-to-bundle-minify-and-cache-bust/

生成这两个文件后，您可以通过脚本标记将它们添加到 html 页面

<script src="Your File Path"></script>

选项 2 是首选方法，我建议您花时间进行设置，因为您只需执行一次即可掌握它