我是新手使用Gulp并尝试将base.less
编译成main.css
文件。我计划添加更少的文件来编译。到目前为止,js在运行gulp
时编译得很好,但不是很少。
我的gulpfile.js
看起来像这样:
// Include gulp
var gulp = require('gulp');
// Include plugins
var concat = require('gulp-concat');
var uglify = require('gulp-uglify');
var rename = require('gulp-rename');
// Concatenate JS Files
gulp.task('scripts', function() {
return gulp.src('static/js/*.js')
.pipe(concat('main.js'))
.pipe(rename({suffix: '.min'}))
.pipe(uglify())
.pipe(gulp.dest('build/js'));
});
// LESS
var less = require('gulp-less');
var path = require('path');
gulp.task('less', function () {
return gulp.src('static/less/*.less')
.pipe(less({
paths: [ path.join(__dirname, 'less', 'includes') ]
}))
.pipe(gulp.dest('build/css'));
});
// Default Task
gulp.task('default', ['scripts']);
这样package.json
:
{
"name": "website",
"version": "0.1.0",
"devDependencies": {
"gulp": "^3.9.0",
"gulp-concat": "^2.6.0",
"gulp-less": "^3.0.3",
"gulp-rename": "^1.2.2",
"gulp-uglify": "^1.4.2",
}
}
文件结构:
|-- build
|-- js
|-- main.js
|-- main.min.js
|-- gulpfile.js
|-- index.html
|-- node_modules
|-- all of those...
|-- package.json
|-- static
|-- img
|-- js
|-- base.js
|-- less
|-- base.less
非常感谢任何帮助!
答案 0 :(得分:1)
根据您的gulpfile.js文件,特别是行gulp.task('default', ['scripts']);
,您似乎没有调用任务来编译较少的文件。
也许您打算使用:
gulp.task('default', ['scripts','less']);