安装gulp前端自动化工具

$ npm install --global gulp

2. 安装gulp插件，gulp插件所属devDependencies下面

$ npm install --save-dev gulp

var gulp = require(‘gulp‘);


gulp.task(‘default‘, function() {
  // place code for your default task here
});

$ gulp

var gulp = require(‘gulp‘),  
    sass = require(‘gulp-ruby-sass‘),
    autoprefixer = require(‘gulp-autoprefixer‘),
    minifycss = require(‘gulp-minify-css‘),
    jshint = require(‘gulp-jshint‘),
    uglify = require(‘gulp-uglify‘),
    imagemin = require(‘gulp-imagemin‘),
    rename = require(‘gulp-rename‘),
    clean = require(‘gulp-clean‘),
    concat = require(‘gulp-concat‘),
    notify = require(‘gulp-notify‘),
    cache = require(‘gulp-cache‘),
    livereload = require(‘gulp-livereload‘);

如果希望和Grunt一样载入所有已安装的插件可以访问下面网址：https://github.com/jackfranklin/gulp-load-plugins

载入所有插件的插件就是它：gulp-load-plugins。 

载入后的使用方式和grunt有些小区别

配上gulpfile.js文件：

‘use strict‘;
 
var gulp = require(‘gulp‘);

//加载package.json文件里的devDependencies中的所有插件
var plugins = require(‘gulp-load-plugins‘)();
 
gulp.task(‘sass‘, function () {
  gulp.src(‘./app/sass/**/*.scss‘)
    .pipe(plugins.sass({ style: ‘expanded‘ }))
    .pipe(plugins.autoprefixer(‘last 2 version‘, ‘safari 5‘, ‘ie 8‘, ‘ie 9‘, ‘opera 12.1‘, ‘ios 6‘, ‘android 4‘))
    .pipe(gulp.dest(‘dist/assets/css‘))
    .pipe(plugins.rename({suffix: ‘.min‘}))
    .pipe(plugins.minifyCss())
    .pipe(gulp.dest(‘dist/assets/css‘))
    .pipe(plugins.notify({ message: ‘Styles task complete‘ }));
});
 
gulp.task(‘sass:watch‘, function () {
  gulp.watch(‘./sass/**/*.scss‘, [‘sass‘]);
});

{
  "name": "gulsp",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "dependencies": {
    "gulp": "^3.9.0"
  },
  "devDependencies": {
    "gulp": "^3.9.0",
    "gulp-autoprefixer": "^3.0.2",
    "gulp-cache": "^0.3.0",
    "gulp-clean": "^0.3.1",
    "gulp-concat": "^2.6.0",
    "gulp-imagemin": "^2.3.0",
    "gulp-jshint": "^1.11.2",
    "gulp-livereload": "^3.8.1",
    "gulp-load-plugins": "^0.10.0",
    "gulp-minify-css": "^1.2.1",
    "gulp-notify": "^2.2.0",
    "gulp-rename": "^1.2.2",
    "gulp-ruby-sass": "^2.0.4",
    "gulp-sass": "^2.0.4",
    "gulp-uglify": "^1.4.2"
  },
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [
    "gulp"
  ],
  "author": "bxcn",
  "license": "ISC"
}

安装gulp前端自动化工具

原文：http://blog.csdn.net/itpinpai/article/details/49151269