错误：html-webpack-plugin 无法缩小生成的输出

Posted 2023-03-07

【中文标题】错误：html-webpack-plugin 无法缩小生成的输出

【英文标题】：Error: html-webpack-plugin could not minify the generated output

【发布时间】：2021-03-02 00:09:50

【问题描述】：

在部署到 heroku 时出现以下错误。我无法解决它，因为我对 html-webpack-plugin 一无所知。请帮忙。我的代码-https://github.com/utkarsh-cmd/Shop_INN

Creating an optimized production build...
    remote:        Failed to compile.
    remote:
    remote:        Error: html-webpack-plugin could not minify the generated output.
    remote:          In production mode the html minifcation is enabled by default.
    remote:          If you are not generating a valid html output please disable it manually.
    remote:          You can do so by adding the following setting to your HtmlWebpackPlugin config  :
    remote:          |
    remote:          |    minify: false
    remote:          |

【参考方案1】：

最好的方法是编辑你的 index.html 并修复错误，我建议使用https://jsonformatter.org/html-validator 修复.html 文件

【参考方案2】：

这可能是语法错误，例如 file.html 中缺少引号或结束标记。

我建议您将代码传递到 HTML 验证器或调试器中，自动检查 html 的错误可以为您节省大量时间。 我用这个解决了这个小错误：https://www.freeformatter.com/html-validator.html

【讨论】：

虽然此链接可能会回答问题，但最好在此处包含答案的基本部分并提供链接以供参考。如果链接页面发生更改，仅链接答案可能会失效。 - From Review

【参考方案3】：

这可能是由于 index.html（在公用文件夹内）中的语法错误而发生的。 例如：index.html 中缺少标签

【参考方案4】：

在我的情况下，错误是：-

错误：html-webpack-plugin 无法缩小生成的输出。 在生产模式下，默认启用 html minifcation。 如果您没有生成有效的 html 输出，请手动禁用它。 您可以通过将以下设置添加到您的 HtmlWebpackPl ugin 配置来做到这一点： | |缩小：假 | 有关详细信息，请参阅https://github.com/jantimon/html-webpack-plugin#options。 对于解析器专用错误，请在此处创建问题： https://danielruf.github.io/html-minifier-terser/ 解析错误： ...

正如您在public/index.html 的第 6 行看到的那样

<meta name="viewport" content="user-scalable="no" />  (I previously made change to it)

这是真正的问题

所以我把它替换为

<meta name="viewport" content="width=device-width, initial-scale=1.0" />(this is defualt one)

再次yarn run build. 问题解决了。