使用fis优化web站点

1，需要nodejs

2，安装fis：npm install --g fis

3，安装打包插件：npm install -g fis-postpackager-simple

4，在站点根目录下添加fis的配置文件fis-conf.js，并添加以下内容

 1 //Step 1. 取消下面的注释开启simple插件，注意需要先进行插件安装 npm install -g fis-postpackager-simple
 2 fis.config.set('modules.postpackager', 'simple');
 3 
 4 //通过pack设置干预自动合并结果，将公用资源合并成一个文件，更加利于页面间的共用
 5 
 6 //Step 2. 取消下面的注释开启pack人工干预
 7 fis.config.set('pack', {
 8     'pkg/lib.js': [
 9         '/lib/mod.js',
10         '/modules/underscore/**.js',
11         '/modules/backbone/**.js',
12         '/modules/jquery/**.js',
13         '/modules/vendor/**.js',
14         '/modules/common/**.js'
15     ]
16 });
17 
18 //Step 3. 取消下面的注释可以开启simple对零散资源的自动合并
19 fis.config.set('settings.postpackager.simple.autoCombine', true);
20 
21 
22 //Step 4. 取消下面的注释开启图片合并功能
23 fis.config.set('roadmap.path', [{
24     reg: '**.css',
25     useSprite: true
26 }]);
27 fis.config.set('settings.spriter.csssprites.margin', 20);
View Code

5，编译发布：fis release -omp

6，启动站点测试：fis server start --type node

7，查看站点的代码：fis server open

 

看一下站点发布前的网页，再看一下编译发布后的有什么区别吧。给你惊喜。

 希望大家尽量按照这篇规范来开发web站点。按这个简单规范开发的东西，更适合fis进行最好的优化。

posted on 2015-01-14 10:35  Questionfeet  阅读(369)  评论(0)  编辑  收藏  举报

导航