npm 包 fis3-packager-djvm-pack 使用教程
在前端开发中，打包工具是非常重要的一部分。FIS 相信大家都不会陌生，是一个非常优秀的前端构建工具。fis3-packager-djvm-pack 是一个 FIS 的插件，我们可以通过该插件将所有依赖打包成一个文件，以便于使用和上线。
安装
首先需要安装 FIS 和 fis3-packager-djvm-pack 。具体方式如下：
全局安装 FIS
npm install -g fis3
安装 fis3-packager-djvm-pack
npm install fis3-packager-djvm-pack --save-dev
安装完成后，需要在 FIS 的配置文件中添加使用该插件的相关配置，具体配置如下：
fis.match('::package', {
packager: fis.plugin('djvm-pack')
})配置完成后，我们就可以愉快的使用 fis3-packager-djvm-pack 进行打包啦！
使用方法
在使用 fis3-packager-djvm-pack 插件打包时，只需要在页面引入需要的文件即可。例如，我们需要打包 jquery 和 bootstrap，我们可以按照以下方式引入：
-- -------------------- ---- ------- --------- ----- ----- ------------- ------ ----- ---------------- ---------- - ----------------------- ------------ ----- ---------------- --------------------------------------------- ------- ------ ---------- ----------------------------- ------- ----------------------------------------- ------- -------------------------------------------------- ------- -------
以上就是我们在页面中引入的两个库，由于 fis3-packager-djvm-pack 需要进行打包的文件仅仅是 page 内直接 script 和 link 标签，所以我们需要分别引用。
在使用完上述代码时，我们需要在终端输入以下命令进行打包：
fis3 release -opd dist
命令含义：
-o表示开启压缩-p表示开启打包-d表示输出路径
最后，我们可以在输出路径 dist 中找到我们打包后的文件，代码如下：
-- -------------------- ---- ------- --------- ----- ----- ------------- ------ ----- ---------------- ---------- - ----------------------- ------------ ----- ---------------- ------------------------ ------- ------ ---------- ----------------------------- ------- ----------------------------- ------- -------
这里的 pkg/css/pkg.css 和 pkg/js/pkg.js 就是打包后输出的文件了。
总结
本文通过学习在 FIS 中使用 fis3-packager-djvm-pack 插件，让我们更进一步了解了前端打包工具的重要性。在上线前一定要进行代码优化和合并，这不仅可以提高网站性能，还可以提高用户体验。而 FIS 可以帮我们完成这些工作，让我们不必手动一个个合并代码，非常方便。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005607881e8991b448dea24