看到 webpack.config.js
文件后,想盘它
我们编辑脚本后,脚本有没有编写正确,通过 debug 来查看是比较高效的。
通过对
webpack
的了解, 具体的webpack
配置信息会通过对应的webpack.config.js
来进行配置
var entry = {};
function walk(dir) {
debugger
dir = dir || '.';
var directory = path.join(__dirname, '../examples', dir);
var entryDirectory = path.join(webSrcDirectory, dir);
fs.readdirSync(directory)
.forEach(function(file) {
...
});
}
module.exports = {
entry: entry,
output: {
path: '.',
filename: '[name].js'
},
module: {
loaders: [
{
test: /\.js$/,
loaders: ['babel-loader'],
exclude: /node_modules/
}
]
}
plugins: [bannerPlugin],
watch:true
}
怎么盘?
配置
修改之前的 package.json 脚本
"scripts": {
"build:examples:web": "webpack --config build/webpack.examples.web.config.js",
}
添加
DEBUG
语句的 package.json 脚本
"scripts": {
"build:examples:web": "node $NODE_DEBUG_OPTION ./node_modules/webpack/bin/webpack.js --config build/webpack.examples.web.config.js"
}
运行+调试
点击
package.json
左边的三角符号, 然后以Debug
的方式进行运行
运行后,通过
debugger
或打断点
的方式进行语句断点