gulp基本入门

gulp是一个前端自动化构建的一个工具

1.前置:

1..1在使用gulp之前，先安装node和npm

2.安装gulp:

2.1 npm install gulp

3.打包项目:

3.1 新建 gulpfile.js

// 获取 gulp
var gulp = require('gulp')

// 获取 uglify 模块（用于压缩 JS）
var uglify = require('gulp-uglify')

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

// 在命令行使用 gulp auto 启动此任务
gulp.task('auto', function () {
    // 监听文件修改，当文件被修改则执行 script 任务
    gulp.watch('js/*.js', ['script'])
})


// 使用 gulp.task('default') 定义默认任务
// 在命令行使用 gulp 启动 script 任务和 auto 任务
gulp.task('default', ['script', 'auto'])

3.2 新建package.json

{}

3.3 运行打包

gulp test

3.4 说明

gulp.src()：:获取源文件

pipe()：管道

uglify()：压缩源文件

gulp.dest()：处理后文件另存为