怎么让 gulp 去执行 webpack 指令

2025-04-28 00:14:54
推荐回答(1个)
回答1:

1.下面我们要来试验如何用gulp来读取webpack的配置文件?
先把webpack.config.js的入口为空

// entry是入口文件,可以多个,代表要编译那些js
entry:{},
1
2
1
2
2.修改gulpfile.js

var gp = require('gulp');
var gulp_webpack = require('gulp-webpack')
var webpack= require('webpack');
var webpack_config = require('./webpack.config.js');

// 生成js文件
gp.task('build-js',function(){
gulp_webpack(webpack_config,webpack)
.pipe(gp.dest('./build/js'))
});

// 读取config
gp.task('config',function () {
var fs = require('fs');
var root = './src/modules/';
var config = {};
var dirObj = fs.readdirSync(root);

dirObj.forEach(function (d) {
// d 是文件夹名,也代表了 我们的入口节点名
var fileObj = fs.readdirSync(root + d);
var ret = fileObj.map(function (jsfile) {
return root + d + '/' + jsfile;
})

config[d] = ret;
})

webpack_config.entry = config;
});

// 最终生成
gp.task('run',['config'],function(){
webpack(webpack_config,function (error,status) {
// 这里需要gulp处理过程
});
})

gulp的config任务里完成了对./src/modules/下文件的读取,然后组织成配置,给web pack的entry

3.执行gulp任务:gulp run 后,同样完成了webpack打包