FIS

学习官网

http://fis.baidu.com/docs/beginning/getting-started.html

 

1. fis release: 编译并发布

    fis release -m: md5加密

    fis release -o : 内容压缩

    fis release -p : 文件打包合并

    

    可连写：fis release -mop

 

2.fis release -w 文件监听

 

 

3.fis-conf.js:

 

 1 // 设置图片合并的最小间隔
 2 fis.config.set('settings.spriter.csssprites.margin', 20);
 3 // 取消下面的注释开启simple插件，注意须要先进行插件安装 npm install -g fis-postpackager-simple
 4 fis.config.set('modules.postpackager', 'simple');
 5 // 取消下面的注释设置打包规则
 6 fis.config.set('pack', {
 7     '/pkg/lib.js': [
 8         'js/lib/jquery.js',
 9         'js/lib/underscore.js',
10         'js/lib/backbone.js',
11         'js/lib/backbone.localStorage.js',
12     ],
13     // 取消下面的注释设置CSS打包规则，CSS打包的同时会进行图片合并
14     '/pkg/aio.css': '**.css'
15 });
16 // 取消下面的注释能够开启simple对零散资源的自动合并
17 // fis.config.set('settings.postpackager.simple.autoCombine', true);

 

 

3.MD5压缩合并发布到src同级本地目录

    fis release -mop -d ../output

 

4.seajs 压缩config处理(这是我本身写的，想config文件里的别名追加时间戳，但愿能有更好的办法)

 

 

 

 

 

-------------------------------------升级至fis3--------------------------------------------

 

 

/****************************************************************************************
 * 1.压缩js
 */
var jsFiles = '{/script/*,/script/*/*,/library/*,/library/*/*,/dist/template}.js';
fis.match(jsFiles, {
    // fis-optimizer-uglify-js 插件进行压缩，已内置
    optimizer: fis.plugin('uglify-js')
});

/****************************************************************************************
 * 2.压缩css
 */
fis.match('*.css', {
    // fis-optimizer-clean-css 插件进行压缩，已内置
    optimizer: fis.plugin('clean-css')
});
/****************************************************************************************
 * 3.合并资源
 */
var commonJs = '/script/common/*.js';
var bundleJs = '{/library/*/*,/script/service/*,/dist/template}.js';

//合并css
fis.match('/dist/style.css', {
    packTo: '/dist/style.css'
});
fis.match('/script/library/swiper/swiper-3.3.1.min.css',{
  packTo:'/dist/swiper.css'
})

//合并js
fis.match(commonJs, {
    packTo: '/dist/common.js'
});
fis.match(bundleJs, {
    packTo: '/dist/bundle.js'
});

/****************************************************************************************
 * 4.对合并CSS进行图片合并
 */
fis.match('::package', {// 启用 fis-spriter-csssprites 插件
    spriter: fis.plugin('csssprites')
})

fis.config.set('settings.spriter.csssprites', {
    //图之间的边距
    margin: 2,
    //使用矩阵排列方式，默认为线性`linear`
    layout: 'matrix'
});

fis.match('/dist/style.css', {
    // 给匹配到的文件分配属性 `useSprite`
    useSprite: true
});

fis.match('::packager', {
    postpackager: fis.plugin('loader')
});

/****************************************************************************************
 * 5.合并资源加时间戳
 */

fis.match('/dist/*.css', {// css加md5
    useHash: true
});
fis.match('/dist/*.js', {// js加md5
    useHash: true
});
fis.match('*.png', {// png加md5
    useHash: true
});
fis.match('*.jpg', {// png加md5
    useHash: true
});


/****************************************************************************************
 * 6.忽略打包无用文件
 */
fis.set('project.ignore', [
  'page/**',
  'tpl/**',
  'script/**',
  'style/**',
  '/*.js',
  '/*.json',
  '/*.txt',
  'node_modules/**',
  '.git/**',
  '.svn/**'
]);

另：

　　忽略页面js，防止沉底-->script后加(不能有空格)

<!--ignore-->