gulp-less没有编译css文件

时间:2015-11-08 23:14:21

标签: npm less gulp

我是新手使用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

非常感谢任何帮助!

1 个答案:

答案 0 :(得分:1)

根据您的gulpfile.js文件,特别是行gulp.task('default', ['scripts']);,您似乎没有调用任务来编译较少的文件。

也许您打算使用:

gulp.task('default', ['scripts','less']);