【fis3学习】中大型项目构建发布实例

本文链接：https://blog.csdn.net/dong123dddd/article/details/51777532

FIS3 , 为你定制的前端工程构建工具 解决前端开发中自动化工具、性能优化、模块化框架、开发规范、代码部署、开发流程等问题。fis内置不少的功能和插件，比gulp.js体积更大功能也更丰富，主打前端构建开发的和发布等流程一体化处理。

最早接触fis是在14年，那时还是fis，功能和新能还有比较多的问题，但是和fis3的改动不大。fis扩展有不少独立的运行版本如yog的php项目版面,pure的纯前端版本等。

本文针对中大型cms项目（项目文件超过1.2G，静态资源类大小800MB）进行测试fis3的相关能力，结果如下：fis3配置简单功能强大，单作为构建项目耗时比较久，debug能力有限，release 开始花费1分钟(59678ms)，编译花费六分钟(303.50s)，觉gulp.js还是有点差距的，见上一篇文章结果。

二、配置文件解析
这里没有做文件指纹，因为fis3在无法处理html中出现的绝对路径和编译文件的对应问题。github上有对源文件就是绝对路径处理没有多少说明的地方。所以处理不是特别的方便。

'use strict';

fis.set('project.ignore', ['node_modules/**','.*','*.json','fis-conf.js','*.md']);

fis.match('*', {//默认不添加hash
        useHash:false
    })
    .match("src/**",{
        useHash:false,
        release:true
    })
    .match('::package',{
      spriter: fis.plugin('csssprites'),
      postpackager: fis.plugin('loader')
    })
    .match("static/admin/**", {
        useHash:false,
        release:true
    })
    .match('static/js/**.js', {
        useHash:false,
        optimizer: fis.plugin('uglify-js'),
        release:'$0',
        domain:"//js.360shouji.com",
        url:'/static/js/$0'
    })
    //css
    .match('www/static/{css,font}/**.{css,less}',{
        useHash:false,
        useSprite: true,
        optimizer: fis.plugin('clean-css'),
        release:'$0',
        domain:"//css.360shouji.com",
        url:'/static/css/$0'
    })
    //文件中的域名引用其实没有替换
    .match('view/**/*.html',{
        isHtmlLike:true,
        //optimizer:fis.plugin('htmlmin'),
        release:"$0"
    })
    //加载前缀域名
    .match('static/{upload,img,video}/**.{png,jpg,gif,jpeg,mp4,webm,ogv}',{
        useHash:false,
        domain:'//res.360shouji.com',
        release:'$0',
        url:'/static/$0'
    })
    //发布到本地
    .match('*', {
        deploy: fis.plugin('local-deliver', {
            to: '/output2'
        })
    })

查看上一篇文章 gulp.js构建发布性能：

gulp.js 花费的时间如下，总共花费 36s 编译完成，copy 800多MB文件花费2分47秒

[18:29:51] Starting 'copy'...
[18:29:51] Starting 'img'...
[18:29:51] Starting 'video'...
[18:29:51] Starting 'js'...
[18:29:51] Starting 'css'...
[18:29:51] Finished 'default' after 23 ms
[18:30:12] Finished 'video' after 20 s
[18:30:12] Finished 'css' after 20 s
[18:30:12] Finished 'js' after 20 s
[18:30:23] Finished 'img' after 32 s
[18:30:23] Starting 'html'...
[18:30:26] Finished 'html' after 3.4 s
[18:30:26] Starting 'col-css'...
[18:30:27] Finished 'col-css' after 1.05 s
[18:32:38] Finished 'copy' after 2.77 min