前言
在前端开发中，优化页面加载速度是一个非常重要的任务，其中对静态资源文件进行压缩、合并以及缓存的操作是不可避免的。而 fis-postpackager-replace 正是一个能够帮助我们完成这些工作的 npm 包。
什么是 fis-postpackager-replace
fis-postpackager-replace 是一个针对 fis3 构建工具的后处理插件，它可以在打包完成后，将 html、css、js 文件中特定的字符串进行替换，从而实现一些自定义的操作。
如何使用 fis-postpackager-replace
安装 fis-postpackager-replace
npm install -g fis-postpackager-replace
修改 fis-conf.js 配置文件
在 fis3 工程中的 fis-conf.js 配置文件中增加以下内容：
-- -------------------- ---- -------
------------------------- -
------------- --------------------- -
--------- -
-
------ ------------------- -- --------
-------- -------- --- ---- -
------ -------- ----------------------- ------------ - - - ------------------- ----- -- - -------------
-
-
-
--
---运行 fis3 构建任务
构建命令：fis3 release prod。
如果 build 过程中没有任何错误，那么就可以在 dist 目录中找到处理完毕的静态资源文件。
patterns 配置
patterns 选项用于设置需要替换的模式，它是一个数组，每个元素为一个对象。
对象有两个属性：
match
需要匹配的字符串，可以使用正则表达式。
replace
在匹配到的字符串中，需要被替换的新字符串。如果 replace 属性是一个函数，那么它的返回值将会作为替换后的新字符串。函数会收到两个参数：
- m：匹配到的字符串。
- map：资源表。
其中 map 表示当前资源所在表格数据。
示例代码
下面是一个示例代码，目的是将所有的外部 JavaScript 文件的地址，替换为经过版本号缓存之后的新地址。
fis-conf.js 配置文件：
-- -------------------- ---- -------
------------------------------- -
-------- ---- -- -- --- ---
---
------------------- -
------------- --------------------- -
--------- -
-
------ -------- --------------------------------------------
-------- ----------- ----
--- --- - ------------
--- --- - ----------------
------ -------- ------ - --- - --------------
-
-
-
--
---index.html 文件：
-- -------------------- ---- ------- --------- ----- ----- ---------- ------ ----- ---------------- --------- - -------------------------------- ------- ------ ------- --------------------------------------- ------- ---------------------------------- ------- -------
参考文献：
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/69934