javascript - 如何从 gulpfile.js 调用 webpack.config.js

Question

我想从 gulpfile.js 在 wepack.config.js 中执行一些过程。

下面是我的项目的树。

src
- main.js
gulpfile.js
webpack.config.js
package.json

这是 gulp 和 webpack 的版本。（内容package.json）

{
  "main": "main.js",
  "scripts": {
    "serve": "webpack",
    "gulp": "gulp"
  },
  "devDependencies": {
    "gulp": "^4.0.2",
    "webpack": "^5.37.1",
    "webpack-cli": "^4.7.0",
    "webpack-stream": "^6.1.2"
  }
}

这是源代码gulpfile.js

const { dest } = require('gulp');
const webpack = require('webpack');
const webpackStream = require('webpack-stream');
const webpackConfig = require('./webpack.config');

const bundle = (done) => {
  webpackStream(webpackConfig, webpack).pipe(dest('dist'));
  done();
};

exports.default = bundle;

这是源代码webpack.config.js

const path = require('path');
module.exports = (env, argv) => {
  return {
    entry: path.resolve(__dirname, 'src', 'main.js'),
    output: {
      filename: 'main.js',
      path: path.resolve(__dirname, 'dist'),
    },
  };
};

当我执行命令时yarn gulp，终端中显示以下消息，但当前目录中没有 dist 文件夹。（如何modules.export从 gulpfile.js 调用 webpack.config.js？）

yarn run v1.21.1
$ gulp
[00:51:43] Using gulpfile C:\MyFolder\dev\gulpfile.js
[00:51:43] Starting 'default'...
[00:51:43] Finished 'default' after 6.56 ms
Done in 1.68s.

但是，当我输入命令yarn serve（调用 webpack）时，会在当前目录上创建 dist 文件夹。

标签： javascriptnode.jswebpackgulp