gulp详细入门教程:http://www.ydcss.com/archives/18
安装gulp
前提:已经安装node.js、npm
$ npm install gulp --save-dev
gulp-sass:将scss编译成css的gulp插件
安装gulp-sass
$ npm install gulp-sass --save-dev
新建package.js文件
基于node.js项目必不可少的配置文件。
{ "name": "gulpText", "version": "3.0.0", "scripts": { "init": "npm install" }, "devDependencies": { "gulp": "^3.9.1", "gulp-sass": "^2.3.2", } }
新建gulpfile.js文件
var gulp = require(‘gulp‘); var sass=require(‘gulp-sass‘); gulp.task(‘testSass‘,function(){ gulp.src(‘distn/styles/main.scss‘) //该任务针对的文件 .pipe(sass()) //该任务调用的模块 .pipe(gulp.dest(‘src/css‘)); //将会在src/css下生成index.css }); gulp.task(‘default‘,[‘testSass‘]);
运行gulp
右键gulpfile.js文件,选择”Show Gulp Tasks”,打开Gulp窗口,双击需要运行的任务即可。
gulp-concat:合并js文件
安装gulp-concat插件
$ npm install gulp-concat --save-dev
var concat = require(‘gulp-concat‘); gulp.task(‘testVendor‘, function () { gulp.src([‘client/vendor/jquery.min.js‘, ‘client/vendor/angular.min.js‘]) .pipe(concat(‘vendor2.js‘)) .pipe(gulp.dest(‘src/js‘)); }); gulp.task(‘default‘, [‘testVendor‘]);
时间: 2024-10-11 10:25:44