gulp合并压缩
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合并压缩的更多相关文章
- 关于用gulp合并压缩seaJs模块
现在很多人都在用seaJs来开发项目,seaJs上手容易,操作简单.但在后期做合并压缩的时候却中了个巨大无比的坑,但坑也总得有人来填.于是花了将近一个星期的时间来填了这坑,现将填坑的一些心得与大家分享 ...
- 使用gulp 合并压缩打包,实时监控文件,实现本地server
今天不讲webpack,就说说gulp是怎么进行压缩合并打包 首先你的安装gulp : npm install gulp -g --save-dev 然后最基本的你因该知道gulp 的四个方法, gu ...
- 介绍一种基于gulp对seajs的模块做合并压缩的方式
之前的项目一直采用grunt来构建,然后用requirejs做模块化,requirejs官方有提供grunt的插件来做压缩合并.现在的项目切到了gulp,模块化用起了seajs,自然而然地也想到了模块 ...
- gulp 之一 安装及简单CSS,JS文件合并压缩
最近研究了一下gulp构建工具,发现使用起来比grunt顺手一些.(个人感受),以下是grunt和gulp构建方式和原理: grunt 基于文件方式构建,会把文件先写到临时目录下,然后进行读文件,修改 ...
- 一篇迟到的gulp文章,代码合并压缩,less编译
前言 这篇文章本应该在去年17年写的,但因为种种原因没有写,其实主要是因为懒(捂脸).gulp出来的时间已经很早了,16年的时候还很流行,到17年就被webpack 碾压下去了,不过由于本人接触gul ...
- 使用gulp对js、css、img进行合并压缩
1 概述 最新使用AngularJS框架做单页面项目,其中包括了很多库的和自已写的js.css.img文件,这些文件都不大,但是数量众多,导致web请求文件过多,一次性加载时比较慢.有尝试过使用异步加 ...
- gulp css 压缩 合并
//导入工具包 require('node_modules里对应模块') var gulp = require('gulp'), //本地安装gulp所用到的地方 concat = require(' ...
- 前端自动化(三) 合并压缩css、压缩js、添加时间戳、打包上线操作
前端自动化(三) 合并压缩css.压缩js.添加时间戳.打包上线操作 此文在前两篇基础上对比参考,会很方便理解 gulp.task("delete",function(){ r ...
- ASP.NET MVC Bundle使用 合并压缩
2017-01-06 更新 在 BundleCollection 的构造函数中添加了 3种默认规则 public BundleCollection() { BundleCollection.AddDe ...
随机推荐
- drupal7 查看哪些模块实现了某个钩子
module_implements($hook) 可参考函数module_invoke_all function module_invoke_all($hook) { $args = func_get ...
- eclipse中DDMS 视图中sdcard中文件导入的处理
首先需要说明下,这里说的sdcard的权限并不是指在Android application程序中设置sdcard的权限读 取问题.而是指在DDMS看到的目录下的那个sdcard目录的权限问题. ...
- 重装系统,打开VS进行程序调试运行的时候 Unable to find manifest signing certificate in the certificate store
重装系统,打开VS进行程序调试运行的时候 Unable to find manifest signing certificate in the certificate store. 项目的属性-> ...
- javaEE-EJB学习笔记
EJB是sun的JavaEE服务器端组件模型,设计目标与核心应用是部署分布式应用程序.简单来说就是把已经编写好的程序(即:类)打包放在服务器上执行.凭借java跨平台的优势,用EJB技术部署的分布式系 ...
- node(3)MVC代码结构模式moogoDB的学习
---恢复内容开始--- 一.MVC代码结构模式 设计模式:观察者模式.中介者模式,这种模式,主要做的事情是处理类与类之间‘高内聚.低耦合’; 代码架构模式:MVC.MVVM.MVP Model:模型 ...
- MongoDB数据库安装及配置环境(windows10系统)
windows10系统下MongoDB的安装及环境配置: MongoDB的安装 下载地址: https://www.mongodb.com/download-center (这是windows10环境 ...
- jsonp promise封装
npm 安装jsonp import originJSONP from 'jsonp' export default function jsonp(url, data, option){ url += ...
- 关于使用Entity Framework时遇到的问题 未找到具有固定名称“System.Data.SqlClient”的 ADO.NET 提供程序的实体框架提供程序。请确保在应用程序配置文件的“entityFramework”节中注册了该提供程序
问题描述: 使用Entity Framework获取数据时报以下错误: 未找到具有固定名称“System.Data.SqlClient”的 ADO.NET 提供程序的实体框架提供程序.请确保在应用程序 ...
- django项目设计
我们以前是只建立一个项目只建立一个app,如果我们要建立多个app的时候 并且这个app要写很多额视图的函数views内函数,要是建立很多种的时候就会造成很冗杂,不美观 我们未来增强解耦性,就把那个 ...
- Python学习---IO的异步[asyncio模块(no-http)]
Asyncio进行异步IO请求操作: 1. @asyncio.coroutine 装饰任务函数 2. 函数内配合yield from 和装饰器@asyncio.coroutine 配合使用[固定格式 ...