前端开发工具---FIS使用总结

介绍


FIS是百度FEX-TEAM团队开发的前端工具。它可以对一个项目中的静态资源JS(比如JS脚本、CSS文件、图片)进行压缩。所谓的压缩是指将JS脚本和CSS文件中的空格去掉,使占用字节最小。而图片压缩后也会变小;可以将一个项目中的所有脚本合并到一个文件中,这个过程也叫做打包,当然CSS文件和图片也可以打包。

使用

首先要安装fis,要安装fis首先得 安装node.js, 安装npm。安装好后进入命令行。
输入:
cd [你的项目的绝对路径]
fis server start

然后,浏览器的URL中输入: http://127.0.0.1:8080/
可以看到你的项目已经成功部署了。


输入:
fis server open
可以打开你刚才部署的根目录

接下来你可以对你的项目中的静态资源进行压缩、打包等操作了。
首先你要安装一个FIS的插件。

进入命令行。
输入:
npm install -g fis-postpackager-simple

接着你需要在你的项目的根路径下新建一个文件:fis-conf.js。
 
    
  1. //Step 1. 开启simple插件,注意需要先进行插件安装 npm install -g fis-postpackager-simple
  2. fis.config.set('modules.postpackager', 'simple');
  3. //通过pack设置干预自动合并结果,将公用资源合并成一个文件,更加利于页面间的共用
  4. //Step 2.将[]里面的所有文件打包到pkg/lib.js目录里
  5. fis.config.set('pack', {
  6. 'pkg/lib.js': [
  7. '/lib/mod.js',
  8. '/modules/underscore/**.js',
  9. '/modules/backbone/**.js',
  10. '/modules/jquery/**.js',
  11. '/modules/vendor/**.js',
  12. '/modules/common/**.js'
  13. ]
  14. });
  15. //Step 3. 除了Step2中手动设置合并的JS脚本之外。通过Step3的配置,可以对其他的脚本进行自动合并。
  16. fis.config.set('settings.postpackager.simple.autoCombine', true);

然后运行命令:
fis release --optimize --pack
这个命令会对JS脚本进行自动合并。

图片合并待续...

你可能感兴趣的:(前端开发)