gulp-demo/gulpfile.js/index.js

const { src, dest, parallel, series, watch } = require('gulp');
const del = require('del');
const inject = require('gulp-inject');
const rename = require('gulp-rename');
const pug = require('gulp-pug');
const less = require('gulp-less');
const path = require('path');
const es = require('event-stream');
const { getPages } = require('./util');
const browserSync = require('browser-sync').create();
const reload = browserSync.reload;

let srcPath = "src"

let isProd = process.env.NODE_ENV === "production"

let distPath = isProd?"dist":"node_modules/.gcache"

let pageNames = getPages()

/**
 * 删除输出文件夹目录
 */
function remove() {
  return del([distPath+'/**/*']);
}
function removeStatic() {
  return del([distPath+'/static/**/*']);
}

const exculde = `!${srcPath}/**/__*/**`

// 处理公共库
function common() {
  let commonJS = src([`${srcPath}/common/**/*.js`,exculde]).pipe(rename({suffix: "._cn",dirname: 'js'}))
  let commonCSS = src([`${srcPath}/common/**/*.css`,exculde]).pipe(rename({suffix: "._cn",dirname: 'css'}))
  let commonLess = src([`${srcPath}/common/**/*.less`,exculde]) .pipe(less()).pipe(rename({suffix: "._cn",dirname: 'css', extname: ".css" }))
  return es.merge(commonJS, commonCSS, commonLess).pipe(dest(`${distPath}`))
}
// 处理页面资源
function page(name="index") {
  let pageJS = src([`${srcPath}/js/${name}/**/*`,exculde]).pipe(rename({suffix: `._${name}`,dirname: 'js'}))
  let pageLess = src([`${srcPath}/css/${name}/**/*.less`,exculde]) .pipe(less()).pipe(rename({suffix: `._${name}`,dirname: 'css', extname: ".css" }))
  let pageCSS = src([`${srcPath}/css/${name}/**/*.css`,exculde]).pipe(rename({suffix: `._${name}`,dirname: 'css'}))
  return es.merge(pageJS, pageCSS, pageLess).pipe(dest(`${distPath}`))
}
// 处理页面资源的包装函数
function asset(name="index") {
  return function asset() {
    return page(name)
  }
}
// 静态资源
function static() {
  return src([`${srcPath}/public/**/*`,exculde]).pipe(dest(`${distPath}`))
}
// 处理页面
function pageFn(name="index") {
  return function page() {
    const jsCNiles = src(`${distPath}/js/**/*._cn.js`, {read: false})
    const jsFiles = src(`${distPath}/js/**/*._${name}.js`, {read: false})
    const cssCNFiles = src(`${distPath}/css/**/*._cn.css`, {read: false})
    const cssFiles = src(`${distPath}/css/**/*._${name}.css`, {read: false})
      return src([`${srcPath}/html/${name}.pug`,exculde]).pipe(pug()).pipe(inject(es.merge(
        jsCNiles,
        cssCNFiles,
        cssFiles,
        jsFiles
      ), {relative: true, ignorePath: `../../${distPath}`})).pipe(dest(`${distPath}`));
  }
}

function allTask(func = asset) {
  let tasks = pageNames.map(v=>{
    return func(v)
  })
  return parallel(...tasks)
}

/**
 * 开发时监听
 */
function watchTask() {
  if(!pageNames.length) return
  const routes = {}
  pageNames.forEach(v=>{
    routes['/'+v]= distPath+`/${v}.html`
  })
  browserSync.init({
    startPath: ``,
    index: '/index.html',
    server: {
        baseDir: `./${distPath}`,
        routes: {
          ...routes
        }
    }
  });
  watch([`${srcPath}/public/**/*`], static) // series(removeStatic, static)
    .on("add", reload)
    .on("change", reload)
    .on("unlink", reload)
  watch([`${srcPath}/common/`], common)
    .on("add", reload)
    .on("change", reload)
    .on("unlink", reload)
  pageNames.forEach(page=>{
    watch([`${srcPath}/{css,js}/${page}/**`], asset(page))
    .on("add", reload)
    .on("change", reload)
    .on("unlink", reload)
  })
  // watch([`${srcPath}/css/**/*`,`${srcPath}/js/**/*`], allTask(asset))
  //   .on("add", reload)
  //   .on("change", reload)
  //   .on("unlink", reload)
  pageNames.forEach(page=>{
    watch([`${srcPath}/html/${page}.pug`], pageFn(page))
    .on("add", reload)
    .on("change", reload)
    .on("unlink", reload)
  })
  // watch([`${srcPath}/html/**/*`], allTask(pageFn))
  //   .on("add", reload)
  //   .on("change", reload)
  //   .on("unlink", reload)
}

exports.watch = series(remove,static, common, allTask(asset), allTask(pageFn), watchTask)
exports.default = series(remove,static, common, allTask(asset), allTask(pageFn))

exports.index = series(remove, static, common, asset("index"), pageFn("index"))
exports.about = series(remove, static, common, asset("about"), pageFn("about"))