更多gulp常用插件使用请访问:gulp常用插件汇总 pump这是一款小型节点模块,可将流连接在一起并在其中一个关闭时将其全部销毁. 使用标准source.pipe(dest)源时,如果dest发出关闭或错误,则不会破坏源.您也无法提供回调以告知管道何时完成.帮你做这两件事 更多使用文档请点击访问pump工具官网. 为什么我们使用pump 当使用Node.js流中的管道时,错误不会通过管道流传播,如果目标流关闭,则源流不会关闭. 泵模块将这些问题规范化,并在回调中传递错误. 其实说白了就是pum

环境 windows 10 准备工具 Visual Studio Code Node.js Git 需求 必须支持IE8 步骤开始: 执行命令行工具 mkdir Demo && cd Demo npm init name: demo version:0.0.1 description:This is a demo. entry point:[Enter] test command:[Enter] git repository:[Enter] keywords:[Enter] author:

1.安装nodejs nodejs 官网下载安装文件 安装完成之后,在命令窗口执行,(显示nodejs版本) 和(显示npm版本)可以使用这两个命令查看是否安装成功: node -v npm -v 2.npm 简介 nodejs 安装过程中会自动安装npm,npm  是nodejs的程序包管理工具,用于从网上下载程序包并安装还可以管理工程对程序包的依赖,类似于java平台上的maven. 程序包是指实现了某些功能,并可以运行于nodejs平台,一般是开源程序,如压缩js代码程序,检查js代码正确

gulpfile.js var gulp = require('gulp'); var rename = require('gulp-rename') var pump = require('pump'); var connect = require('gulp-connect'); //ftl转html gulp.task('ftl-html',function(cb){ pump([ gulp.src('WEB-INF/page/Wechat/*.ftl'), rename({extname

引入相对应的文件 let gulp = require("gulp"); let inject = require("gulp-inject"); let cleanCss = require("gulp-clean-css"); let uglify = require("gulp-uglify"); let pump = require("pump"); let cache = require(&quo

pump = require('pump') pump简介 https://github.com/terinjokes/gulp-uglify/blob/master/docs/why-use-pump/README.md#why-use-pump 当使用来自Node.js的管道时,错误不会通过管道流向前传播,如果目标流关闭,源流也不会关闭.pump模块将这些问题规范化,并在回调中传递错误. pump可以使我们更容易找到代码出错位置. A common gulpfile example A co

功能描述生成sourcemap文件(什么是sourcemap?请参考,简单讲就是文件压缩后不利于查看与调试,但是有了sourcemap,出错的时候,除错工具将直接显示原始代码,而不是转换后的代码) 插件安装$ cnpm install gulp-sourcemaps --save-dev1使用方法例1:生成JS文件的sourcemap var gulp = require('gulp'), uglify = require('gulp-uglify'), concat = require('gu

功能描述 gulp默认使用最大并发数执行任务,也就是说所有的任务几乎都是同时执行,而不会等待其它任务.但很多时候,任务是需要有先后次序的,比如要先清理目标目录,然后再执行打包. run-sequence 的作用就是控制多个任务进行顺序执行或者并行执行 gulp-run-sequence 也是实现相同功能,但已经被标记为deprecated 插件安装 $ cnpm install run-sequence --save-dev 1 使用方法 执行前端代码自动构建,一般会分为以下几个步骤 1. 清理

var gulp = require('gulp'), uglify = require('gulp-uglify'), concat = require('gulp-concat'); var pump = require('pump'); var minifycss = require('gulp-minify-css'); var htmlmin = require('gulp-htmlmin'); gulp.task('compress', function (cb) { pump([

一.整体结构分析 整体结构 通过在nodejs环境对源码的打印,我们最终得到的gulp实例行如下图.那么我们gulp实例上的属性和方法是如何生成的呢? Gulp { domain: null, _events: [Object: null prototype] {}, _eventsCount: 0, _maxListeners: undefined, _registry: DefaultRegistry { _tasks: {} }, _settle: false, watch: [Funct

更多gulp常用插件使用请访问:gulp常用插件汇总 gulp-uglify这是一款使用UglifyJS缩小js文件. 更多使用文档请点击访问gulp-uglify工具官网. 安装 一键安装不多解释 npm install --save-dev gulp-uglify 使用 var gulp = require('gulp'); var uglify = require('gulp-uglify'); var pipeline = require('readable-stream').pipel

流程 1. 输入命令(可以使用git bash或者命令控制台cmd) npm install -g gulp 安装全局gulp命令 2. 创建一个项目文件夹, 当前项目文件夹下输入命令npm init 配置package.json文件, 这一部分看情况自己决定是否填, 不想填也可以, 直接按回车 当前项目文件夹下输入命令npm install gulp --save-dev 全局安装gulp后,还需要在每个要使用gulp的项目中都单独安装一次 开始使用gulp 其实, gulp的使用比webpa

通过前面几节的准备工作,对于 npm / node / gulp 应该已经有了基本的认识,本节主要介绍如何构建一个基本的前端自动化开发环境. 下面将逐步构建一个可以自动编译 sass 文件.压缩 javascript 文件.多终端多浏览器同步测试的开发环境,并且还可以通过 piblish 命令对项目下的文件进行打包操作. 相关连接导航 在windows下安装gulp —— 基于 Gulp 的前端集成解决方案(一) 执行 $Gulp 时发生了什么 —— 基于 Gulp 的前端集成解决方案(二) 常

前两篇文章讨论了 Gulp 的安装部署及基本概念,借助于 Gulp 强大的 插件生态 可以完成很多常见的和不常见的任务.本文主要汇总常用的 Gulp 插件及其基本使用,需要读者对 Gulp 有一个基本的了解.如果你对 Gulp 还不是很了解,可以通过下面两篇文章快速了解 Gulp . 由于几乎所有的插件都有非常友好的使用文档,所以本文不讨论涉及插件使用的东西,仅是一个汇总.排名不分先后. 相关连接导航 在windows下安装gulp —— 基于 Gulp 的前端集成解决方案(一) 执行 $Gul

相关连接导航 在windows下安装gulp —— 基于 Gulp 的前端集成解决方案(一) 执行 $Gulp 时发生了什么 —— 基于 Gulp 的前端集成解决方案(二) 常用 Gulp 插件汇总 —— 基于 Gulp 的前端集成解决方案(三) 构建一个基本的前端自动化开发环境 —— 基于 Gulp 的前端集成解决方案(四) 一.准备工作 1.什么是 npm? npm 是 nodejs 的包管理工具,主要功能就是管理.更新.搜索.发布node的包.Gulp 就是通过 NPM 安装的.关于 NP

前言 文章 在windows下安装gulp —— 基于 Gulp 的前端集成解决方案(一) 中,已经完成对 gulp 的安装,由于是window环境,文中特意提到了可以通过安装 gitbash 来代替 window 系统的 CMD 命令行工具.本节主要围绕 如何使用 Gulp 完成一个预编译 SASS 文件的任务 来逐步熟悉 Gulp . 本文地址:http://www.cnblogs.com/leonkao/p/4611102.html 相关连接导航 在windows下安装gulp —— 基于

本文链接:http://www.ydcss.com/archives/18 gulp详细入门教程 简介: gulp是前端开发过程中对代码进行构建的工具,是自动化项目的构建利器:她不仅能对网站资源进行优化,而且在开发过程中很多重复的任务能够使用正确的工具自动完成:使用她,我们不仅可以很愉快的编写代码,而且大大提高我们的工作效率. gulp是基于Nodejs的自动任务运行器, 她能自动化地完成 javascript/coffee/sass/less/html/image/css 等文件的的测试.检查

1.目标 最近项目上的事情不多,根据我自己的开发习惯,决定开发一些简单的开发架子,方便以后事情多的时候直接套用.本文讲的一个gulp+webpack+vue的单页应用架子,想要达到的目的: 可以通过命令打包开发chunk,并支持热替换 可以通过命令打包可发布的chunk 支持路由 路由中的代码实现按需加载 用CommonJs的风格组织代码 代码结构尽量清晰易懂 尽我所能先做出一个满足以上特点的架子吧,最近看完ES6,准备再去看看flux和reduce,看过之后再来思考下前端数据如何管理比较科学规

一.安装 1)安装nodejs 通过nodejs的npm安装gulp,插件也可以通过npm安装.windows系统是个.msi工具,只要一直下一步即可,软件会自动在写入环境变量中,这样就能在cmd命令窗口中直接使用node或npm指令.

原文地址:gulp初学 至于gulp与grunt的区别,用过的人都略知一二,总的来说就是2点: 1.gulp的gulpfile.js  配置简单而且更容易阅读和维护.之所以如此,是因为它们的工作方式不同,gulp的流式构建使得gulpfile.js文件写起来并不是像Gruntfile.js一样完成一个个插件的配置那样多.对于这点我的理解还不是很深刻,只能暂时这样做一个比较吧,以后的学习接触多了应该就会深刻的体会到. 2.似乎gulp的上手比grunt更简单一些,或者说一个是轻量级一个是重量级的吧