还有就是,我哪里搞错了请大佬指正指正,谢谢

参考你的代码，结合老师的版本；解决报错 “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!");}));

版本问题: 高版本官网上这种注册方式已经不支持了,高版本用下边的方式

你的gulp版本和老师的不一致，图方便的话 把package.json中的 依赖部分代码改成

"devDependencies": {
"babel-core": "^6.22.1",
"babel-loader": "^6.2.10",
"babel-preset-es2015": "^6.22.0",
"gulp": "^3.9.1",
"gulp-less": "^3.3.0",
"gulp-util": "^3.0.8",
"webpack-stream": "^3.2.0"
}

然后删除node_modules包，重新 yarn install 或者npm install 一下 就可以运行了

缺少文件，重新安装以下 。

你的webpack版本可能是4.0的，而本篇文章用的版本不是4.0的，语法写法上是有出入的

gulp 4.0的原因。 最后

gulp.task("default"，["webpack,"less"]);

修改一下 

gulp.task("default", gulp.parallel('webpack', 'less',async()=>{await console.log("gulp complete!");}));

另外 webpack 和less两个任务也要加上async 和await来标示任务完成，否则会报错。这些是gulp4.0新的api，和之前不一样了

https://gitee.com/jamesfancy/sudoku

这里有更新过的代码可以参考

具体什么原因要看输出的错误信息，如果没有安装 yarn，也可以用 npm init 来初始化。

录制视频的时候 npm 相对于 yarn 还较弱，不过现在 npm4~5 都很强了，有时候比 yarn 还快些

最新的代码在 Gitee 上（https://gitee.com/jamesfancy/sudoku ），已经修改为 gulp4 和 webpack4 了

要运行 gulp 需要在项目目录下有 gulpfile.js 或者 gulpfile.ts 才行（后者需要 ts-node 之类的转义工具库），一般用 gulpfile.js 就好，视频中有示例的。

我的还发生错误了呢，求解不知道怎么修改了

webpack 是新版的，用视频的方法运行错误，所以修改如下，

module.exports = {

entry: {

index: './js/index'

},

output: {

filename: '[name].js'

},

resolve: {

extensions: ['.js']

},

module: {

rules: [{

test: /\.js$/,

exclude: /node_modules/,

use: [{

loader: 'babel',

options: {

presets: ['es2015']

}

}]

}]

}

}

错误如下：

λ gulp

[18:47:27] Using gulpfile F:\qianduan_dir\00program\JQuery\shudu\src\gulpfile.js

[18:47:27] Starting 'webpack'...

[18:47:32] Finished 'webpack' after 4.83 s

[18:47:32] Starting 'less'...

[18:47:33] Finished 'less' after 771 ms

[18:47:33] Starting 'default'...

[18:47:33] Finished 'default' after 86 μs

internal/streams/legacy.js:59

      throw er; // Unhandled stream error in pipe.

      ^

Error: Entry module not found: Error: Can't resolve 'babel' in 'F:\qianduan_dir\00program\JQuery\shudu\src'

BREAKING CHANGE: It's no longer allowed to omit the '-loader' suffix when using loaders.

                 You need to specify 'babel-loader' instead of 'babel',

                 see https://webpack.js.org/migrate/3/#automatic-loader-module-name-extension-removed

resolve 'babel' in 'F:\qianduan_dir\00program\JQuery\shudu\src'

  Parsed request is a module

  using description file: F:\qianduan_dir\00program\JQuery\shudu\src\package.json (relative path: .)

    resolve as module

      F:\qianduan_dir\00program\JQuery\shudu\node_modules doesn't exist or is not a directory

      F:\qianduan_dir\00program\JQuery\node_modules doesn't exist or is not a directory

      F:\qianduan_dir\00program\node_modules doesn't exist or is not a directory

      F:\node_modules doesn't exist or is not a directory

      looking for modules in F:\qianduan_dir\node_modules

        No description file found

      looking for modules in F:\qianduan_dir\00program\JQuery\shudu\src\node_modules

        using description file: F:\qianduan_dir\00program\JQuery\shudu\src\package.json (relative path: ./node_modules)

          using description file: F:\qianduan_dir\00program\JQuery\shudu\src\package.json (relative path: ./node_modules/babel)

            no extension

              F:\qianduan_dir\00program\JQuery\shudu\src\node_modules\babel doesn't exist

        No description file found

            .js

              F:\qianduan_dir\00program\JQuery\shudu\src\node_modules\babel.js doesn't exist

        no extension

          F:\qianduan_dir\node_modules\babel doesn't exist

            .json

              F:\qianduan_dir\00program\JQuery\shudu\src\node_modules\babel.json doesn't exist

        .js

          F:\qianduan_dir\node_modules\babel.js doesn't exist

            as directory

              F:\qianduan_dir\00program\JQuery\shudu\src\node_modules\babel doesn't exist

        .json

          F:\qianduan_dir\node_modules\babel.json doesn't exist

        as directory

          F:\qianduan_dir\node_modules\babel doesn't exist

补充，我复看了老师的代码结构没有问题，

需要确认一下你的gulpfile.js、node_module、webpack.config.js所在文件夹，即为gulp构建的目录，此处运行gulp命令后，会打包生成和构建目录平行的www。 

-root

    -src

        +node_modules

        +js

        +less

        -gulpfile.js

        -package.json

        -webpack.config.js 

   -www

        +js

        +css

如此，则cd到src目录后gulp构建。 

gulp.src('./js/**/*.js').pipe(webpack(config)).pipe(gulp.dest('../www/js'));

gulp.src('./less/*.less').pipe(less()).pipe(gulp.dest('../www/css'))

你说less文件没有输出，那原因大概是less文件没有找到，由于构建会忽略，不会报错。 

建议还是在第三课项目配置那一段再看一下，尝试给less文件夹下新增内容，看看打包是否会到/www/css文件夹。

编辑器 VSCode

构建工具用了 Gulp + Webpack + Babel + TypeScript

我使用了 VSCode 的 Start any shell 插件。

gulpfile.js第八行 ：webpack(config)

config需要传进去才有用

另外不知道是不是版本问题

exclude需要使用绝对路径

我现在使用的webpack-stream是4.0版本的跟视频上的配置文件不一样

之前没接触过webpack，现在算是简单了解了一点

这是我的配置，你可以参考一下

const path = require('path');

module.exports = {
entry: {
index: "./js/index"
},
output: {
filename: "[name].js"
},
devtool: "source-map",
resolve: {
extensions: [".js"]
},
module: {
loaders: [{
test: /\.js$/,
loader: "babel-loader",
query: {
presets: ["es2015"]
},
exclude: [
                path.resolve(__dirname, "node_modules")
]
}]
}
}