1.安装ruby
2.配置环境变量
电脑右键→属性→高级系统设置→环境变量→系统变量path,,,ruby路劲到bin;
3.安装sass
可以在项目中安装,
gem install sass
4.
sass = require('gulp-ruby-sass'), gulp.task('sass', function() { return sass('scss/*.scss') .on('error', function(err) { console.error('Error!', err.message); }) .pipe(gulp.dest('public/css')) });
5.设置自动监听:
gulp.task('auto', function() {
// 监听文件修改,当文件被修改则执行
gulp.watch('scss/*.scss', ['sass'])
});
6.设置默认,gulp时运行的模块
gulp.task('default',function() {
gulp.start('minifycss', 'minifyjs','sass','auto');
});
或者
//gulp.task('default', ['sass', 'auto'])
=========================================
编译less
1.安装lessnpm install gulp-less --save-dev
2.
gulp.task('testless', function () {
gulp.src('less/index.less') //该任务针对的文件
.pipe(less()) //该任务调用的模块
.pipe(gulp.dest('public')); //
});
====
//监听gulp.watch
gulp.task('auto', function() {
// 监听文件修改,当文件被修改则执行
gulp.watch('scss/*.scss', ['sass'])
gulp.watch('less/index.less', ['testless'])
});
//
gulp.task('default', ['sass', 'auto'])
cmd中输入gulp即可执行sass和auto任务