gulpjs许多src和许多dest文件。

时间:2018-01-15 15:21:21

标签: javascript css gulp less

这是我文件夹的结构:

-content
--1
---assets
----css (here style.css after compiled style.less 
----less (here style.less)
--2
---assets
----css (same as eg. 1)
----less (same as eg. 1)
--3
...

这是我的gulpfile.js

const gulp = require('gulp');
const less = require('gulp-less'); 
const autoprefixer = require('gulp-autoprefixer');
const browserSync = require('browser-sync').create();
const reload = browserSync.reload;
const rename =  require("gulp-rename");

// Task to compile less, autoprefix and refresh css files in browser
gulp.task('compile-less', function() {
  return gulp.src('content/$**/assets/less/style.less')
    .pipe(less())
    .pipe(autoprefixer({
        browsers: ["last 2 version", "> 1%", "ie >= 8", "Firefox > 15", "iOS >= 5", "Android >= 2.3"]
    })) //        .pipe(rename("2*/assets/css/"))
    .pipe(gulp.dest('content/$**/assets/css'))
    .pipe(browserSync.stream());
});

// Task to compile html and refresh html files
gulp.task('compile-html', function() {
  return gulp.src('content/**/*.html')
    .pipe(browserSync.stream());
});

// Task to watch less, html changes
gulp.task('watch-files', function() {
  gulp.watch('content/**/assets/less/*.less', ['compile-less']);
  gulp.watch('content/**/*.html', ['compile-html']);
});

gulp.task('serve', function () {
  // Serve files from the root of this project
  browserSync.init({
    server: {
      baseDir: "."
    }
  });
});

// Task when running `gulp` from terminal 
gulp.task('default', ['serve', 'watch-files']);

如何将gulpfile.js写入内容/ {variable} / assets / less中的内容/ {variable} / assets / css中的css进行多次编译。我希望gulp在我为例如保存时自动执行。 content / 5 / assets / less / style.less,将css编译成content / 5 / css / style.css

非常感谢[:

0 个答案:

没有答案