gulp #gulp Table of Contents About 1 Chapter 1: Getting started with gulp 2 Remarks 2 Versions 2 Examples 2 Installation or Setup 2 1. Install Node.js and NPM: 2 2. Install gulp globally: 2 4. Install gulp in your project devDependencies: 3 5. Create a gulpfile.js at the root of your project: 3 6. Run gulp: 3 Task dependency 3 Concat js file in sub folder using gulp 4 gulp CLI docs 4 References 6 Examples 6 Setting up Browser sync And Configuring Watchers for Style and Script 6 NOTE 6 Gulp Watchdog Task 6 Snippet - 1 - inside watchdog boilerplate 7 snippet - 2 - inside watchdog boilerplate

来源：https://github.com/nimojs/gulp-book gulp 是基于 node 实现 Web 前端自动化开发的工具，利用它能够极大的提高开发效率。 在 Web 前端开发工作中有很多“重复工作”，比如压缩CSS/JS文件。而这些工作都是有规律的。找到这 些规律，并编写 gulp 配置代码,让 gulp 自动执行这些“重复工作”。 将规律转换为 gulp 代码 现有目录结构如下： └── dist/js/ 目录下 编写 gulp 代码 // 压缩 JavaScript 文件 gulp.task('script', function() { // 1. 找到 gulp.src('js/*.js') // 2. 压缩 .pipe(uglify()) // 3. 另存 .pipe(gulp.dest('dist/js')); dest('dist/js')); }); 代码执行结果 代码执行后文件结构 └── js/ │ └── a.js └── dist/ └── js/ └── a.js gulp 入门指南 - 1 - 本文档使用 看云 构建 a.js 压缩前 function demo (msg) { alert('--------\r\n' + msg + '\r\n--------') }

主流浏览器器⽀支持情况 图⽚片压缩 CSS 前缀补全/预处理理器器 前端构建演变之路路 ant + YUI Tool grunt gulp fis3 webpack parcel rollup 为什什么选择 webpack? webpack grunt gulp 定义 Module bundler Task runner Task runner 语⾔言 JavaScript Node