Menu
Considering the following Webpack Gulp task, how can this be integrated with Gulp in such a way that after compiling Webpack pipes the files to Gulp so that I can run further tasks?
gulp.task('webpack', function(callback) {
webpackCompiler.run(function(err, stats) {
if (err) {
throw new plugins.util.PluginError('webpack', err);
}
plugins.util.log('webpack', stats.toString({
colors: true,
}));
callback();
});
});
gulp.task('set-env-dev', function() {
webpackConfig.plugins = [
new webpack.BannerPlugin(info.name + '\n' + info.version + ':' + Date.now() + ' [development build]'),
new ComponentPlugin()
];
webpackCompiler = webpack( webpackConfig );
});
866
In fact, webpack is a module binder, whereas gulp. js is a task runner -- this very definition implies that we can use both of the tools in assonance with each other with little to no conflict. But owing to webpack's wide array of features, many developers use webpack as a replacement for gulp.
Webpack is a bundler whereas Gulp is a task runner, so you'd expect to see these two tools commonly used together. Instead, there's a growing trend, especially among the React community, to use Webpack instead of Gulp.
Both tools are task runners that use Node. js, which is an open source JavaScript runtime environment used to develop tools and applications. Grunt and Gulp both also use plugins to accomplish whatever tasks you need them to automate for you. Both tools use . js files to build tasks; for Grunt, you use a gruntfile.
There is now a plugin for Gulp that allows deeper integration of Webpack and Gulp: https://github.com/shama/webpack-stream
108
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
