1、文件合并压缩

  var concat = require(‘gulp-concat’); //引用

  var uglify = require(‘gulp-uglify’); 
  接下来,只要concat(‘xxx.js’)就算合并了。注意此时只是在内存中生成

  前面我们学过管道的概念,因此代码整合非常简单 
  gulp.src([这里写上js]).pipe(concat(‘xxx.js’)).pipe(uglify()).pipe(gulp.dest(‘目录’))

2、gulp-useref进行资源合并

  文件配置:通过插入特定的标签,用于标示gulp-useref要处理的资源

 

gulp脚本:

tip

通常,我们希望资源进行合并输出后,删除掉合并前的js和css,避免接下来进行其他处理时,要手动再写脚本排除掉它们。 
所以,需求是使用gulp-useref合并资源输出并删除合并前的文件。 
查看源码和参照官方配置,惊喜发现,改下gulp脚本就可以达到目的:

If you want to minify your assets or perform some other modification, you can use gulp-if to conditionally handle specific types of assets.

Blocks are expressed as:

gulp合并压缩的更多相关文章

  1. 关于用gulp合并压缩seaJs模块

    现在很多人都在用seaJs来开发项目,seaJs上手容易,操作简单.但在后期做合并压缩的时候却中了个巨大无比的坑,但坑也总得有人来填.于是花了将近一个星期的时间来填了这坑,现将填坑的一些心得与大家分享 ...

  2. 使用gulp 合并压缩打包,实时监控文件,实现本地server

    今天不讲webpack,就说说gulp是怎么进行压缩合并打包 首先你的安装gulp : npm install gulp -g --save-dev 然后最基本的你因该知道gulp 的四个方法, gu ...

  3. 介绍一种基于gulp对seajs的模块做合并压缩的方式

    之前的项目一直采用grunt来构建,然后用requirejs做模块化,requirejs官方有提供grunt的插件来做压缩合并.现在的项目切到了gulp,模块化用起了seajs,自然而然地也想到了模块 ...

  4. gulp 之一 安装及简单CSS,JS文件合并压缩

    最近研究了一下gulp构建工具,发现使用起来比grunt顺手一些.(个人感受),以下是grunt和gulp构建方式和原理: grunt 基于文件方式构建,会把文件先写到临时目录下,然后进行读文件,修改 ...

  5. 一篇迟到的gulp文章,代码合并压缩,less编译

    前言 这篇文章本应该在去年17年写的,但因为种种原因没有写,其实主要是因为懒(捂脸).gulp出来的时间已经很早了,16年的时候还很流行,到17年就被webpack 碾压下去了,不过由于本人接触gul ...

  6. 使用gulp对js、css、img进行合并压缩

    1 概述 最新使用AngularJS框架做单页面项目,其中包括了很多库的和自已写的js.css.img文件,这些文件都不大,但是数量众多,导致web请求文件过多,一次性加载时比较慢.有尝试过使用异步加 ...

  7. gulp css 压缩 合并

    //导入工具包 require('node_modules里对应模块') var gulp = require('gulp'), //本地安装gulp所用到的地方 concat = require(' ...

  8. 前端自动化(三) 合并压缩css、压缩js、添加时间戳、打包上线操作

    前端自动化(三)   合并压缩css.压缩js.添加时间戳.打包上线操作 此文在前两篇基础上对比参考,会很方便理解 gulp.task("delete",function(){ r ...

  9. ASP.NET MVC Bundle使用 合并压缩

    2017-01-06 更新 在 BundleCollection 的构造函数中添加了 3种默认规则 public BundleCollection() { BundleCollection.AddDe ...

随机推荐

  1. AngularJS之过滤器

    AnularJS的过滤器用来格式化需要展示给用户的数据,有很多实用的内置过滤器,也可以自己编写. 在HTML中的模板绑定符号{{ }}内通过|符号来调用过滤器.例如,假设我们希望将字符串转换成大写,可 ...

  2. AGC009:Eternal Average

    传送门 好神啊 直接考虑一棵 \(n+m\) 个叶子的 \(k\) 叉树,根结点权值为 \(\sum_{i\in m}(\frac{1}{k})^{deep_i}\) 对于一个 \(deep\) 的序 ...

  3. 【朴灵评注】JavaScript 运行机制详解:再谈Event Loop

    PS: 我先旁观下大师们的讨论,得多看书了~   别人说的:“看了一下不觉得评注对到哪里去,只有吹毛求疵之感. 比如同步异步介绍,本来就无大错:比如node图里面的OS operation,推敲一下就 ...

  4. Android:Building " " Gradle project info 问题

    Android Studio新建或者打开项目的时候,一直卡在Building "" Gradle project info 进度上不动,猜测是网络原因下载gradle不成功. 两种 ...

  5. Android埋点技术分析

    1.现有的几种埋点技术的实现原理和优劣分析 (1)代码埋点:将收集数据的代码直接写在需要的地方,当用户点击某个控件或者打开某个页面时调用到该部分代码完成数据的收集. 优势:准确性高,收集数据和发送数据 ...

  6. PSP软件开发过程

    1. 引言 这是为了编写psp系统的软件需求分析,主要按照提供的相关需求和功能. 1.1 项目风险 风险承担者包括: 任务提出者:承担任务不能完全按照想象的做出,投入等: 软件开发者:可能不能按时交付 ...

  7. node和iisnode express手工安装

    一.安装node.js的x86版本: 这样,node.js会安装在C:\Program Files (x86)\nodejs,这符合iisnode express7版本的期待. 二.安装iisnode ...

  8. plsql常用函数

    1)处理字符的函数 || 或 CONCAT---并置运算符. 格式∶CONCAT(STRING1, STRING2) 例:’ABC’|| ’DE’=’ABCDE’ CONCAT(‘ABC’,’DE’) ...

  9. [SQLServer] 数据库SA用户被锁定或者忘记密码的恢复

    一.以管理员权限运行命令提示符 CMD C:\>net stop mssqlserver您想继续此操作吗? (Y/N) [N]: y C:\>net start mssqlserver / ...

  10. [翻译] VENCalculatorInputView

    VENCalculatorInputView https://github.com/venmo/VENCalculatorInputView VENCalculatorInputView is the ...