我一直在研究如何使用带有webpack的把手装载器的示例,但似乎没有使用webpack 4。
错误
ERROR in ./src/templates/property-list-item.hbs
Module build failed: TypeError: Cannot read property 'handlebarsLoader' of undefined
at getLoaderConfig (/Users/Sam/Desktop/mettamware/Public/js/node_modules/handlebars-loader/index.js:24:37)
at Object.module.exports (/Users/Sam/Desktop/mettamware/Public/js/node_modules/handlebars-loader/index.js:32:15)
@ ./src/property-list.js 5:0-58 40:23-31
@ ./src/app.js
当我查看node_modeules/handlerbars-loader/index.js
时,违规行为是
function getLoaderConfig(loaderContext) {
var query = loaderUtils.getOptions(loaderContext) || {};
var configKey = query.config || 'handlebarsLoader';
var config = loaderContext.options[configKey] || {};
delete query.config;
return assign({}, config, query);
}
我的webpack.config.js
const path = require('path');
module.exports = {
entry: './src/app.js',
output: {
path: path.resolve(__dirname, 'dist'),
filename: 'bundle.js'
},
module: {
rules: [
{
test: /\.hbs$/,
use: [{
loader: "handlebars-loader",
options: {
helperDirs: path.resolve(__dirname, "./src/helpers")
}
}]
}
]
},
node: {
fs: 'empty'
}
};
如果有人可以提供帮助,我将非常感激。我一直在寻找解决方案的几个小时,并尝试了很多事情,但没有到达任何地方。
答案 0 :(得分:2)
同样正在升级旧的webpack 4 ......
显然,过去可以在配置上设置自定义属性。那就是它正在寻找handlebarsLoader
。
当您在其上设置handleBarLoader
属性时会发出此错误。
对于加载程序选项:webpack 2不再允许配置中的自定义属性。
应该更新加载程序以允许通过module.rules中的加载程序选项传递选项。
在加载器更新之前,可以使用LoaderOptionsPlugin将这些选项传递给加载器:
plugins: [
new webpack.LoaderOptionsPlugin({
// test: /\.xxx$/, // may apply this only for some modules
options: {
handlebarsLoader: ...
}
})
]
就我而言,现在就这样设置:
plugins: [
new webpack.LoaderOptionsPlugin({
options: {
handlebarsLoader: {}
}
})
]
答案 1 :(得分:1)
在Webpack 4 loaderContext.options
已替换为loaderContext.rootConfig
。
handlebars-loader
包进行了{p> This commit以使其与Webpack 4兼容,但尚未发布。
目前我已经卸载了handlebars-loader
并且正在使用this fork。
运行这两个命令。
npm uninstall handlebars-loader
npm install @icetee/handlebars-loader
在webpack.config.js
中,替换
loader: "handlebars-loader"
<强>与强>
loader: "@icetee/handlebars-loader"