简介：

　　使用gulp-less插件将less文件编译成CSS。

1、安装gulp-less

在命令行里使用npm install gulp-less --save-dev ;

2、配置gulpFile.js

2.1基本使用

var gulp = require('gulp'),           //获取gulp模块    less = require('gulp-less');      //获取gulp-less插件 gulp.task('testLess', function () {   //创建gulp任务    gulp.src('src/less/index.less')   //获取less文件路径        .pipe(less())　　　　　　　　   //执行less        .pipe(gulp.dest('src/css'));  //输出CSS文件路径});

　2.2编译多个less文件

　

var gulp = require('gulp'),           //获取gulp模块    less = require('gulp-less');      //获取gulp-less插件 gulp.task('testLess', function () {   //创建gulp任务    gulp.src(['src/less/index.less','src/less/detail.less'])   //获取多个less文件路径        .pipe(less())　　　　　　　　   //执行less        .pipe(gulp.dest('src/css'));  //输出CSS文件路径});

　2.3匹配符使用

var gulp = require('gulp'),           //获取gulp模块    less = require('gulp-less');      //获取gulp-less插件 gulp.task('testLess', function () {   //创建gulp任务    gulp.src('src/less/*.less'])   //获取所有less文件路径        .pipe(less())　　　　　　　　   //执行less        .pipe(gulp.dest('src/css'));  //输出CSS文件路径});

　3.3多模块使用先编译再压缩

var gulp = require('gulp'),    less = require('gulp-less'),     //确保本地已安装gulp-minify-css [cnpm install gulp-minify-css --save-dev]    cssmin = require('gulp-minify-css'); gulp.task('testLess', function () {    gulp.src('src/less/index.less')        .pipe(less())　　//执行编译        .pipe(cssmin()) //对编译后的CSS进行压缩         .pipe(gulp.dest('src/css'));});