zoukankan      html  css  js  c++  java
  • FIS常用功能之资源合并

    这节讲资源合并,实战目录如下:

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>fis test</title>
        <script src="/js/a.js"></script>
        <script src="/js/b.js"></script>
        <script src="/js/other1.js"></script>
        <script src="/js/other2.js"></script>
        <link rel="stylesheet" href="/css/global.css">
        <link rel="stylesheet" href="/css/home.css">
    </head>
    <body>
        <h1>Hello FIS</h1>
    </body>
    </html>

    1.纯合并

    创建文件 fis-config.js ,内容:

    fis.config.set('pack', {
        //设置js打包规则
        '/pkg/lib.js': [
            'js/a.js',
            'js/b.js'
        ],
        //设置CSS打包规则
        '/pkg/aio.css': '**.css'
    });

    运行:

    fis release -pd ./

    然后就会出现一个新的文件夹pkg,包含合并后的文件lib.js和aio.css

     

    2.:合并并替换原资源

    需要利用:fis-postpackager-simple插件

    首先安装

    npm install -g fis-postpackager-simple

    修改fis-config.js 

    //开启simple插件,注意需要先进行插件安装 npm install -g fis-postpackager-simple
    fis.config.set('modules.postpackager', 'simple');
    
    //设置合并打包规则
    fis.config.set('pack', {
        '/pkg/lib.js': [
            'js/a.js',
            'js/b.js'
        ],
        '/pkg/aio.css': '**.css'
    });

    打包合并:

    fis release --pack

    合并前后页面引用情况

    3.:对零散资源打包

    在fis-conf.js加入

    //将零散资源进行自动打包
     fis.config.set('settings.postpackager.simple.autoCombine', true);

    再次运行FIS构建项目

    fis release -omp

  • 相关阅读:
    Python基本数据类型
    DNS服务
    在浏览器地址栏输入百度网址之后的故事(面试必考)
    C++对象的赋值和复制
    C++区别于其他语言的知识点总结
    SQL连接查询(最全面)
    源码堆栈信息保存 到此一游
    linux 内核调试之关键函数名记要
    记几个命令 转
    JS 奇淫巧技 转
  • 原文地址:https://www.cnblogs.com/tinyphp/p/4963000.html
Copyright © 2011-2022 走看看