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 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 pageName = "index" /** * 删除输出文件夹目录 */ 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 watchTask() { browserSync.init({ startPath: `/${pageName}.html`, server: { baseDir: `./${distPath}`, } }); 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) watch([`${srcPath}/css/**/*`,`${srcPath}/js/**/*`], asset(pageName)) .on("add", reload) .on("change", reload) .on("unlink", reload) watch([`${srcPath}/html/**/*`], pageFn(pageName)) .on("add", reload) .on("change", reload) .on("unlink", reload) } exports.watch = series(remove,static, common,parallel(asset(pageName)),parallel(pageFn(pageName)),watchTask) exports.default = series(remove,static, common, parallel(asset("index"), asset("about")),parallel(pageFn("index"), pageFn("about"))) exports.index = series(remove, static, common, asset("index"), pageFn("index")) exports.about = series(remove, static, common, asset("about"), pageFn("about"))