fis入门-单文件编译之文件优化（optimize）

好了，这篇文章不是fis的科普文，官方文档已经挺详细了。这里主要讲下fis单文件编译的优化（optimize）环节。

那么fis是如何做到这一点的呢？

其实很简单。拿官网的demo来说，假设我们在运行 fis release 的时候加上 --optimize 参数，那么所有的css、js、图片文件都会被优化（文件压缩）。

fis的系列插件中，以fis-optimizer 开头的插件都是用来完成文件优化这一任务的，比如 fis-optimizer-uglifiy-js、fis-optimizer-clean-css 等。因为fis已经默认内置并配置好了 fis-optimizer-uglifiy-js、fis-optimizer-clean-css等插件，所以运行时检测到 --optimizer 参数时，就会调用相应的插件，完成对js、css、图片文件的优化。

在前端构建中，js文件的压缩绝对是非常重要的一环。在fis内置插件中，js文件压缩这个重任是由fis-optimizer-uglify-js来完成的。那么，我们就来看看它的源码，千万不要吓到。

相信各位看官的第一反应跟我差不多，都是大喊一声what the fuck，竟然只有这么几行代码。当然，这里并没有任意贬低的色彩，而是由衷地赞叹，这插件实现得相当精妙（由fis的架构设计决定的）。

小标题起得有点标题党啦，之所以会写这篇文章，是因为想要了解fis插件的配置、自定义，在官方文档间绕来绕去才找到了一点门路，觉得有必要备忘一下。

fis默认的js压缩插件用的是fis-optimizer-uglify-js，如果我们想用自己定义的插件，比如 fis-optimizer-test 呢？（请原谅我随便起了个名字）。很简单，首先改下项目配置（fis-conf.js），指定js压缩采用 fis-optimizer-test这个插件。

插件指定好了，那这个插件从哪来呢？原谅我又偷懒了，只是在 fis-optimizer-uglify-js插件 的同级目录下，将 fis-optimier-uglify-js 这个目录复制了一遍，然后将index.js的内容改成下面这样子。（项目实战中真有这样的插件就逆天了。。。）

再次运行之前的构建命令

看看被压缩后的demo.js，就可以看到区别了。堪称史上最逆天的js代码压缩工具，无任何代码优化功能，还乱插代码。。。

fisd的官方文档算是比较详细，设计细节的描述也不少，所以本文就不打算成体系地从头到尾把fis的设计原理讲一遍了，仅仅是挑一些小点出来备忘而已。

ps：前文的插图来自fis的官方wiki，不算盗图吧~~如果涉及盗图还请提醒下~~