捆绑一个 angular 1.5.x 不是用 npm 构建的应用程序
Bundle a angular 1.5.x application that was not built with npm
所以我有这个 Angular 我构建的应用程序,没有想到它会增长得如此之大和如此之快。
但现在我在 26 个 css 个文件和 55 个 javascript 个文件中下载了 ~1.9MB!!!!
当然加载时间很糟糕,占用20秒加载!!!
四处寻找,我发现我可以将所有文件打包成一个 .html
文件,
一个 .css
文件和一个 .js
文件。使用众多可用选项之一,webpack、rollup、gulp、grunt,也许还有其他一些我错过的选项。
问题是,我一开始并没有使用 npm
来安装所有依赖项,而是下载了每个库的 min.js
文件,并将它们全部包含在 index.html
文件.
除了使用 npm 重建我的应用程序之外,我还有其他选择吗?
有没有我可以遵循的简单指南,它将连接并缩小所有文件,以便我可以看看是否真的值得这么麻烦?
在所有可用的不同捆绑选项中,最简单的选项是什么?
是的,你还有另一个选择!
Gulp 是你的朋友,非常容易设置,他会帮助你将所有的 js 代码打包并压缩到一个或两个文件(我将我的打包代码分成 2 个文件,一个是所有的lib文件,包括angular本身,还有一个文件是我自己的代码)。
您可以从这篇简单的文章开始:
https://markgoodyear.com/2014/01/getting-started-with-gulp/
所以我有这个 Angular 我构建的应用程序,没有想到它会增长得如此之大和如此之快。
但现在我在 26 个 css 个文件和 55 个 javascript 个文件中下载了 ~1.9MB!!!!
当然加载时间很糟糕,占用20秒加载!!!
四处寻找,我发现我可以将所有文件打包成一个 .html
文件,
一个 .css
文件和一个 .js
文件。使用众多可用选项之一,webpack、rollup、gulp、grunt,也许还有其他一些我错过的选项。
问题是,我一开始并没有使用 npm
来安装所有依赖项,而是下载了每个库的 min.js
文件,并将它们全部包含在 index.html
文件.
除了使用 npm 重建我的应用程序之外,我还有其他选择吗?
有没有我可以遵循的简单指南,它将连接并缩小所有文件,以便我可以看看是否真的值得这么麻烦?
在所有可用的不同捆绑选项中,最简单的选项是什么?
是的,你还有另一个选择!
Gulp 是你的朋友,非常容易设置,他会帮助你将所有的 js 代码打包并压缩到一个或两个文件(我将我的打包代码分成 2 个文件,一个是所有的lib文件,包括angular本身,还有一个文件是我自己的代码)。
您可以从这篇简单的文章开始: https://markgoodyear.com/2014/01/getting-started-with-gulp/