Windows上使用Gulp

以Windows10为例

前提

本机已经安装并配置好NodeJS

安装

cmd进入Windows命令行窗口，进入测试目录，C:\Develop\gulptest，如果没有需要创建，在测试目录下执行

C:\Develop>mkdir gulptest
C:\Develop>cd gulptest
C:\Develop\gulptest>npm init
This utility will walk you through creating a package.json file.
It only covers the most common items, and tries to guess sensible defaults.

See `npm help json` for definitive documentation on these fields
and exactly what they do.

Use `npm install <pkg>` afterwards to install a package and
save it as a dependency in the package.json file.

Press ^C at any time to quit.
package name: (gulptest)
version: (1.0.0)
description:
entry point: (index.js)
test command:
git repository:
keywords:
author:
license: (ISC)
About to write to C:\Develop\gulptest\package.json:

{
  "name": "gulptest",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC"
}


Is this OK? (yes)

下面他会要求你填写一些项目信息,那个可以稍后再去填,所以一路回车就行了.他会在目录下生成一个 package.json 文件

全局安装gulp

C:\Develop\gulptest>npm install gulp-cli -g
C:\Develop\gulptest>npm install gulp -g

安装Gulp到项目中

输入以下命令把gulp安装到当前项目中,并告诉那个package.json你使用了gulp

npm install gulp -D

项目根目录下建立gulpfile.js

安装插件

npm install gulp-uglify -D

编写gulpfile.js

//获取刚刚安装的gulp
var gulp = require('gulp')

//获取刚刚安装的gulp-uglify模块
var uglify = require('gulp-uglify')

//压缩 js 文件
//在命令行使用 gulp uglifyscript 启动此任务
gulp.task('uglifyscript', done => {
    // 1. 找到文件
    gulp.src('src/js/*.js')
    // 2. 压缩文件
    .pipe(uglify())
    // 3. 另存压缩后的文件
    .pipe(gulp.dest('dist/js'))

    done()
})

执行

C:\Develop\gulptest>gulp uglifyscript
[10:42:20] Using gulpfile C:\Develop\gulptest\gulpfile.js
[10:42:20] Starting 'uglifyscript'...
[10:42:20] Finished 'uglifyscript' after 9.48 ms

其他插件

参考：https://fdietz.github.io/2015/04/13/day-1-how-to-build-your-own-team-chat-in-five-days.html

gulp-sass
gulp-sourcemaps
gulp-autoprefixer

分别用来编译css