Question

我使用的是webpack，最近更新了几个软件包（babel，babel-loader，..），并在webpack输出中看到错误。但是，不确定如何进一步调试。该应用程序似乎工作正常。我尝试了各种调试选项，但没有得到错误的详细输出。

 ./node_modules/.bin/webpack  --config webpack.config.js --progress --profile --colors --display-error-details --display-reasons --debug
NODE_ENV == production :  false
6809ms build modules      
14ms seal
55ms optimize
30ms hashing
59ms create chunk assets
27ms additional chunk assets
1551ms optimize chunk assets
33ms optimize assets
83ms emit
Hash: 5be1a8485c4110c2f837
Version: webpack 1.9.8
Time: 8674ms
      Asset       Size  Chunks             Chunk Names
mww7few.ttf    78.4 kB          [emitted]   
elilql0.png    7.47 kB          [emitted]  
  client.js    3.98 MB       0  [emitted]  main
 index.html  130 bytes          [emitted]  
   [0] multi main 52 bytes {0} [built]
       factory:0ms building:3ms = 3ms
    + 387 hidden modules

ERROR in undefined

我不确定ERROR in undefined是什么。我怀疑加载器存在问题，因为我更新了babel-loader但不知道如何了解更多信息。

Answer 1

@bsr

我最近遇到了同样的问题。事实证明它来自HtmlWebpackPlugin。我忘了传递一个标题

new HtmlWebpackPlugin({
  ....
  title: 'Title'
}),

在我的模板上，我有这个 <title>{%=o.htmlWebpackPlugin.options.title

所以如果你使用HtmlWebpackPlugin，请确保你传递了所有参数。

Answer 2

这是webpack-html-plugin 1.4版中的一个错误，已修复为1.5

错误的原因是不推荐使用o.htmlWebpackPlugin.assets 您应该使用o.htmlWebpackPlugin.files代替能够使用css和清单文件：

<!DOCTYPE html>
<html{% if(o.htmlWebpackPlugin.files.manifest) { %} manifest="{%= o.htmlWebpackPlugin.files.manifest %}"{% } %}>
  <head>
    <meta charset="UTF-8">
    <title>{%=o.htmlWebpackPlugin.options.title || 'Webpack App'%}</title>
    {% if (o.htmlWebpackPlugin.files.favicon) { %}
    <link rel="shortcut icon" href="{%=o.htmlWebpackPlugin.files.favicon%}">
    {% } %}
    {% for (var css in o.htmlWebpackPlugin.files.css) { %}
    <link href="{%=o.htmlWebpackPlugin.files.css[css] %}" rel="stylesheet">
    {% } %}
  </head>
  <body>
    {% for (var chunk in o.htmlWebpackPlugin.files.chunks) { %}
    <script src="{%=o.htmlWebpackPlugin.files.chunks[chunk].entry %}"></script>
    {% } %}
  </body>
</html>

然而，甚至有一种更简单的方法 webpack-html-plugin 1.3+具有将所有资产（css，favicon，javascript和清单文件）注入模板的功能。所以你的配置可能如下所示：

new HtmlWebpackPlugin({
  inject: true,
  template: 'template.html',
  title: 'Custom template',
})

和模板：

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>{%=o.htmlWebpackPlugin.options.title || 'Webpack App'%}</title>
  </head>
  <body>
  </body>
</html>

Answer 3

如果有人遇到这个问题并且它不是htmlWebpackPlugin的问题，IMO的实际问题是Webpack本身并没有提供正确的错误。

显然这个PR试图解决它

https://github.com/webpack/webpack/pull/1146

我们使用的插件是错误的字符串。   然而，重新安排的错误是

错误未定义，这几乎没有帮助。现在我们真的得到了   我们需要的错误报告。

Stats now错误报告捕获字符串错误。出现一些插件   不遵守错误报告规则。然而，这使得调整   对用户来说是一场噩梦。因此应该允许字符串。

webpack详细错误消息

3 个答案: