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

  • 相关阅读:
    [718. 最长重复子数组]
    排序算法--归并,堆,快速排序
    改进的插排--希尔排序
    排序算法--选泡插
    对封装继承多态的理解
    Servlet[springmvc]的Servlet.init()引发异常
    [面试题 16.18. 模式匹配]
    [124. 二叉树中的最大路径和](
    7.29_python_lx_day11
    7.28_python_lx_day18
  • 原文地址:https://www.cnblogs.com/tinyphp/p/4963000.html
Copyright © 2011-2022 走看看