gulp-webpack使用中遇到的疑问？
小弟今天打算搭一个gulp+webpack的环境，遇到一个小问题，请各位大神给分析一下。
首先安装了gulp，gulp-webpack，webpack等等。版本如下：
"devDependencies": {
"gulp": "^3.9.1",
"gulp-changed": "^1.3.2",
"gulp-concat": "^2.6.1",
"gulp-debug": "^3.0.0",
"gulp-minify-css": "^1.2.4",
"gulp-minify-html": "^1.0.6",
"gulp-rename": "^1.2.2",
"gulp-sass": "^2.3.2",
"gulp-uglify": "^2.0.0",
"gulp-webpack": "^1.5.0",
"webpack": "^1.13.3"
}然后是gulpfile.js:
var gulp = require('gulp'),
sass = require('gulp-sass'),
rename = require('gulp-rename'),
minifyCss = require('gulp-minify-css'),
changed = require('gulp-changed'),
debug = require('gulp-debug'),
minifyHtml = require('gulp-minify-html'),
webpack = require("webpack"),
gulpWebpack = require('gulp-webpack');
var distCss = 'webContent/css',
distJs = 'webContent/js',
distBase = 'webContent';
gulp.task('compile-sass',function(){
return gulp.src('src/scss/*.scss')
.pipe(changed(distCss,{extension:'.css'}))
.pipe(debug({title:'debuging:'}))
.pipe(sass.sync().on('error', sass.logError))
.pipe(minifyCss())
.pipe(rename(function(path){
path.basename=path.basename;
path.extname = ".css";
}))
.pipe(gulp.dest(distCss));
});
gulp.task('compile-js',function(){
return gulp.src('src/js/*.js')
.pipe(changed(distJs))
.pipe(debug({title:'debuging js:'}))
.pipe(gulpWebpack(require('./webpack.config.js')))
.pipe(gulp.dest(distJs));
});
gulp.task('compile-html',function(){
return gulp.src('src/**/*.html')
.pipe(changed(distBase,{extension:'.html'}))
.pipe(debug({title:'debuging:'}))
.pipe(minifyHtml())
.pipe(rename(function(path){
path.basename=path.basename;
path.extname = ".html";
}))
.pipe(gulp.dest(distBase));
});
gulp.task('watch',function(){
gulp.watch('src/sass/*.*',['compile-sass']);
gulp.watch('src/js/*.*',['compile-js']);
gulp.watch('src/**/*.*',['compile-html']);
});
gulp.task('default',['compile-sass','compile-js','compile-html']);
最后是webpack.config.js:
var webpack = require("webpack");
module.exports = {
debug: true,
watch: true,
// this is the "entry" file of your app. Think of it as your Angular "app.js" file.
entry: "./src/js/index.js",
// this is the will-be-outputted file you'll reference in your index.html file
output: {
path: __dirname+'/webContent/js',
filename: "bundle.js"
},
module: {
loaders: [
// nothing here yet! We'll add more stuff in Part 2
]
},
resolve: {
// for illustration purposes, let's use lodash.
// this tells Webpack where actually to find lodash because you'll need it in the ProvidePlugin
// alias: {
// lodash: path.resolve( __dirname, './node_modules/lodash-node/modern'),
// }
},
plugins: [
// this tells Webpack to provide the "_" variable globally in all your app files as lodash.
// new webpack.ProvidePlugin({
// _: "lodash",
// })
]
}单独运行webpack是可以的，会在js文件夹里输出bundle.js文件。
但是我用gulp去执行，不会产出bundle.js,控制台信息如下：
并没有什么有用的信息输出。。。
我分析就是说gulp是执行了的，但是到了webpack里边可能有问题了。
然后我就从网上看到了gulp-webpack的别的一些参数：
https://www.npmjs.com/package...
我就试了试：
gulp.task('compile-js',function(){
return gulp.src('src/js/*.js')
.pipe(changed(distJs))
.pipe(debug({title:'debuging js:'}))
.pipe(gulpWebpack(require('./webpack.config.js'),null,function(){}))
.pipe(gulp.dest(distJs));
});竟然就成功了：
我也多试了几次，发现gulpWebpack这个函数，如果不写第三个参数，也就是那个function(){},就会失败，写上就成功了，这是为啥？？
这是我配置有问题，还是说这个版本的有bug？请大神帮忙分析一下，我的环境是win7，node v4.4.6
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
这个问题没想到这么快就自问自答了。。。
我的nodejs版本是4.4.6，我从官网下载了一个稳定版的6.9.1
https://nodejs.org/en/
在原目录安装以后，直接运行，提示binding了一次node sass，然后问题就解决了，无论哪种写法都能顺利通过了。
原来是因为我的nodejs版本太陈旧了。
最开始我安装nodejs是从node中文网下载的稳定版，直到后来我去了node的官网才知道稳定版已经是6.9了，话说node中文网是不是该更新一下了。