这节讲资源合并，实战目录如下：

<!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

FIS常用功能之资源合并的更多相关文章

  1. FIS常用功能之资源压缩

    fis server start后 资源压缩,只需要使用命令,不需要添加任何配置 fis release --optimize 或: fis release -o 在浏览器访问按F12,观看压缩前后文 ...

  2. FIS常用功能之MD5版本

    静态资源后缀加上md5参数,有效解决缓存更新问题 fis release --optimize --md5 使用前后对比:

  3. [转]WebPack 常用功能介绍

    概述 Webpack是一款用户打包前端模块的工具.主要是用来打包在浏览器端使用的javascript的.同时也能转换.捆绑.打包其他的静态资源,包括css.image.font file.templa ...

  4. FastReport.Net 常用功能总汇

    一.常用控件 文本框:输入文字或表达式 表格:设置表格的行列数,输入数字或表达式 子报表:放置子报表后,系统会自动增加一个页面,你可以在此页面上设计需要的报表.系统在打印处理时,先按主报表打印,当碰到 ...

  5. WebPack常用功能介绍

    概述 Webpack是一款用户打包前端模块的工具.主要是用来打包在浏览器端使用的javascript的.同时也能转换.捆绑.打包其他的静态资源,包括css.image.font file.templa ...

  6. Keil的使用方法 - 常用功能（二）

    Ⅰ.概述 上一篇文章是总结关于Keil使用方法-常用功能(一),关于(文件和编译)工具栏每一个按钮的功能描述和快捷键的使用. 我将每一篇Keil使用方法的文章都汇总在一起,回顾前面的总结请点击下面的链 ...

  7. Keil的使用方法 - 常用功能（一）

    Ⅰ.概述 学习一门软件的开发,开发工具的掌握可以说尤为重要.由于Keil集成开发工具支持多种MCU平台的开发,是市面上比较常见的,也是功能比较强大一款IDE.所以,对于大多数人说,选择Keil几乎是单 ...

  8. 转： 尽己力，无愧于心 FastReport.Net 常用功能总汇

    FastReport.Net 常用功能总汇   一.常用控件 文本框:输入文字或表达式 表格:设置表格的行列数,输入数字或表达式 子报表:放置子报表后,系统会自动增加一个页面,你可以在此页面上设计需要 ...

  9. ROS(indigo)机器人操作系统学习资料和常用功能包汇总整理(ubuntu14.04LTS)

    ROS(indigo)机器人操作系统学习资料和常用功能包汇总整理(ubuntu14.04LTS) 1. 网站资源: ROSwiki官网:http://wiki.ros.org/cn GitHub    ...

随机推荐

  1. C++ 模板的用法

    C++中的高阶手法就会用到泛型编程,主要有函数模板, 在程序中使用模板的好处就是在定义时不需要指定具体的参数类型,而在使用时确可以匹配其它任意类型, 定义格式如下 template <class ...

  2. keil问题：Error: failed to execute 'C:\Keil\ARM\BIN\ArmCC'

    1.打开cmd,进入相应的路径下 cd C:\Keil\ARM\BIN\ 输入 armcc  若显示如下界面则说明keil已经注册 2.若注册成功还没解决问题,则说明软件是在网上下载的破解版的,建议卸 ...

  3. TCP三次握手和四次挥手及用户访问网页流程

    TCP报文格式 TCP通信是通过报文进行的,首先要了解TCP报文的格式. 序号:Seq序号,占32位,用来标识从TCP源端向目的端发送的字节流,发起方发送数据时对此进行标记. 确认序号:Ack序号,占 ...

  4. linux命令（49）：wget命令

    Linux wget是一个下载文件的工具,它用在命令行下.对于Linux用户是必不可少的工具,尤其对于网络管理员,经常要下载一些软件或从远程服务器恢复备份到本地服务器.如果我们使用虚拟主机,处理这样的 ...

  5. node-session

    session cookie 虽然很方便,但是使用 cookie 有一个很大的弊端,cookie 中的所有数据在客户端就可以被修改,数据非常容易被伪造,那么一些重要的数据就不能存放在 cookie 中 ...

  6. QT中ui更改后不能更新的解决方法

    ui源文件到界面显示的原理可以网上搜索,这里不再描述.简单讲就是先要从*.ui生成ui_*.h然后再编译,所以界面未更新实际上是因为ui_*.h这个文件没有更新导致的. 出现此问题后我尝试了以下几个方 ...

  7. Thinking in java基础之集合框架(转载)

    集合简介(容器)把具有相同性质的一类东西,汇聚成一个整体,就可以称为集合,例如这里有20个苹果,我们把每一个苹果当成一个东西(一个对象),然后我们借用袋子把这20个苹果装起来,而这个袋子就是集合(也叫 ...

  8. 用webpy实现12306余票查询

    效果

  9. AC日记——餐巾计划问题 洛谷 P1084

    餐巾计划问题 思路: 氧气优化水过: 代码: #include <bits/stdc++.h> using namespace std; #define maxn 4005 #define ...

  10. 在SpringMVC中 /* 和 / 的区别

    <url-pattern> / </url-pattern>:会匹配到 /springmvc 这样的路径型url,而不会匹配到像 .jsp 这样的后缀型的url. <ur ...