标签：src 技术 编译 命令 默认 mini ide reg tar
gulp基于node
1、全局安装gulp：
$ npm install --global gulp
2、前往项目目录，然后安装作为项目的开发依赖（devDependencies）：
$ npm install --save-dev gulp
1 var gulp = require(‘gulp‘); 2 3 gulp.task(‘default‘, function() { 4 // 将你的默认的任务代码放在这 5 console.log("hello gulp"); 6 });
4、运行gulp：
$ gulp
默认运行名为 default 的任务（task），在这里，这个任务打印"hello gulp"。
想要单独执行特定的任务（task）输入：gulp 任务名。
生成项目所需信息文件package.json：
输入命令npm init，一路按enter完成后自动生成package.json文件。
示例代码：
1 var gulp = require(‘gulp‘), 2 uglify = require(‘gulp-uglify‘), 3 concat = require(‘gulp-concat‘), 4 rename = require(‘gulp-rename‘), 5 cssnano = require(‘gulp-cssnano‘), 6 image = require("gulp-image"), 7 del = require(‘del‘), 8 less = require(‘gulp-less‘); 9 10 //压缩css,压缩后的文件放入dest/css 11 gulp.task(‘minifycss‘, function() { 12 return gulp.src(‘css/*.css‘) 13 .pipe(cssnano()) //压缩 14 .pipe(gulp.dest(‘dest/css‘));//输出 15 }); 16 //合并并压缩css，合并压缩后的文件放入dest/css 17 gulp.task(‘concatminifycss‘, function() { 18 return gulp.src(‘css/*.css‘) 19 .pipe(concat(‘main.css‘)) //合并所有css到main.css 20 //.pipe(gulp.dest(‘dest/css‘)) //输出main.css到文件夹 21 //.pipe(rename({suffix: ‘.min‘})) //rename压缩后的文件名 22 .pipe(cssnano())//压缩 23 .pipe(gulp.dest(‘dest/css‘));//输出 24 }); 25 26 //压缩js，压缩后的文件放入dest/js 27 gulp.task(‘minifyjs‘, function() { 28 return gulp.src(‘js/*.js‘) 29 .pipe(uglify())//压缩 30 .pipe(gulp.dest(‘dest/js‘));//输出 31 }); 32 33 //合并并压缩js，合并压缩后的文件放入dest/js 34 gulp.task(‘concatminifyjs‘, function() { 35 return gulp.src(‘js/*.js‘) 36 .pipe(concat(‘main.js‘)) //合并所有js到main.js 37 .pipe(gulp.dest(‘dest/js‘)) //输出main.js到文件夹 38 .pipe(rename({suffix: ‘.min‘})) //rename压缩后的文件名 39 .pipe(uglify())//压缩 40 .pipe(gulp.dest(‘dest/js‘));//输出 41 }); 42 43 //压缩图片，压缩后的文件放入dest/images 44 gulp.task(‘image‘,function(){ 45 gulp.src(‘images/*.+(jpg|png|gif|svg)‘) 46 .pipe(image())//压缩 47 .pipe(gulp.dest(‘dest/images‘));//输出 48 }); 49 50 //执行压缩前，先删除dest文件夹里的内容 51 gulp.task(‘clean‘, function(cb) { 52 del([‘dest/*‘], cb) 53 }); 54 55 //编译less到css 56 gulp.task("less",function(){ 57 gulp.src(‘css/*.less‘) 58 .pipe(less()) 59 .pipe(gulp.dest("dest/css")); 60 61 }); 62 //监视文件的变化 63 gulp.task("watch",function(){ 64 gulp.watch("css/*.less",[‘less‘]); 65 66 }); 67 68 //默认命令，在cmd中输入gulp后，执行的就是这个命令 69 gulp.task(‘default‘, function() { 70 // 将你的默认的任务代码放在这 71 gulp.start(‘clean‘,‘concatminifycss‘,‘image‘,‘concatminifyjs‘); 72 });
淘宝NPM镜像：
npm install -g cnpm --registry=https://registry.npm.taobao.org
注：mac系统要在前面加sudo
标签：src 技术 编译 命令 默认 mini ide reg tar
原文地址：http://www.cnblogs.com/98-bky/p/6193219.html
