Webpack 4.x 版本下的 gulpfile.js 的配置
廢話不多說, 直接上源碼:(全選復制黏貼到你的 gulpfile.js 文件中即可)
const?gulp?=?require("gulp"); gulp.task("webpack",?async()=>{await?console.log("gulp?complete!");}); gulp.task("less",?async()=>{await?console.log("gulp?complete!");}); gulp.task("default",?gulp.parallel('webpack',?'less',async()=>{await?console.log("gulp?complete!");}));
在shell中測試的結果為:
F:\Software\html\2019年12月11日\src>gulp [12:31:18]?Using?gulpfile?F:\Software\html\2019年12月11日\src\gulpfile.js [12:31:18]?Starting?'default'...[12:31:18]?Starting?'webpack'... [12:31:18]?Starting?'less'... [12:31:18]?Starting?'<anonymous>'... gulp?complete! gulp?complete! gulp?complete! [12:31:18]?Finished?'webpack'?after?3.76?ms [12:31:18]?Finished?'less'?after?4.5?ms [12:31:18]?Finished?'<anonymous>'?after?7.42?ms [12:31:18]?Finished?'default'?after?11?ms
完成! 后面的跟著老師的代碼再敲就可以了.
不過, 我建議最好能在一開始就按照老師的版本安裝, 畢竟這是 JS 課程, 學習 gulp 打包只是其次的.
2021-06-03
參考你的代碼,結合老師的版本;解決報錯 “Task function must be specified”
const?gulp?=?require("gulp");
//?轉譯Javascrit
gulp.task("webpack",?async()=>{
????const?webpack?=?require("webpack-stream");
????gulp.src("./js/**/*.js")
????.pipe(webpack())
????.pipe(gulp.dest("../www/js"));
});
//?編譯less?->?css
gulp.task("less",?async()=>{
????const?less?=?require("gulp-less");
????gulp.src("./less/*.less")
????.pipe(less())
????.pipe(gulp.dest("../www/css"));
});
gulp.task("default",?gulp.parallel('webpack',?'less',?async()=>{await?console.log("gulp?complete!");}));
2019-12-11
如果還有啥問題可以發郵件給我, 我的郵箱是: [email protected]