Gulp 的使用

官网：https://gulpjs.com/docs/en/getting-started/quick-start

可以使用 Gulp 直接来构建自动化，使用简单，里面提供了 4000 多个插件

// gulpfile.js
const gulp = require('gulp');
const clean = require('gulp-clean'); // https://www.npmjs.com/package/gulp-clean
const concat = require('gulp-concat'); // https://www.npmjs.com/package/gulp-concat
const inject = require('gulp-inject'); // https://www.npmjs.com/package/gulp-inject
const uglify = require('gulp-uglify'); // https://github.com/terinjokes/gulp-uglify
const sourcemaps = require('gulp-sourcemaps'); // https://www.npmjs.com/package/gulp-sourcemaps
const spawn = require('cross-spawn'); // https://www.npmjs.com/package/cross-spawn
const postcss = require('gulp-postcss'); // https://github.com/postcss/gulp-postcss
const babel = require('gulp-babel'); // https://github.com/babel/gulp-babel// 安装
// pnpm i -D gulp cross-spawn gulp-postcss gulp-uglify gulp-babel @babel/core @babel/preset-env gulp-concat gulp-sourcemaps gulp-inject// NOTE: 需要去 package.json 中配置 "scripts": { "build:vite": "vite build" } 并且删除 "type": "module" 或改为 "type": "commonjs"const pathDist = 'dist';gulp.task('clean', (cb) => {gulp.src([pathDist], { read: false, allowEmpty: true }).pipe(clean());console.log('清空dist目录成功');cb();
});gulp.task('build-vite', (cb) => {spawn.sync('pnpm run build:vite', [], { stdio: 'inherit' });console.log('编译vite项目成功');cb();
});gulp.task('build-css', (cb) => {gulp.src(`${pathDist}/**/*.css`).pipe(postcss([])).pipe(gulp.dest(`${pathDist}/styles`));console.log('编译styles成功');cb();
});gulp.task('build-js', (cb) => {gulp.src(`${pathDist}/**/*.js`).pipe(sourcemaps.init()).pipe(babel({presets: ['@babel/env'],compact: true,}),).pipe(concat(`sitecore-console.min.js`)).pipe(uglify()).pipe(sourcemaps.write(`maps`)).pipe(gulp.dest(`${pathDist}/scripts`));console.log('编译js成功');cb();
});gulp.task('build-inject', (cb) => {gulp.src(`${pathDist}/**/*.css`).pipe(postcss([])).pipe(gulp.dest(`${pathDist}/styles`));console.log('编译styles成功');cb();
});gulp.task('default', gulp.series(['clean', 'build-vite', 'build-css', 'build-js']), (cb) => {console.log('编译成功');cb();
});