Entrypoint undefined = index.html html-webpack-plugin 错误ERROR in Error: Child compilation failed: Module build failed (from ./node_modules/html-webpack-plu SyntaxError: Unexpected token )

时间：2020-03-04 10:48:48 收藏：0 阅读：3289

Entrypoint undefined = index.html html-webpack-plugin 错误

ERROR in Error: Child compilation failed:
Module build failed (from ./node_modules/html-webpack-plu
SyntaxError: Unexpected token )

Child html-webpack-plugin for "index.html":
1 asset
Entrypoint undefined = index.html
[0] ./node_modules/html-webpack-plugin/lib/loader.js!./
[built] [failed] [1 error]

错误步骤重现

依照本人博客中的 webpack详细步骤执行到下面这一步

话说使用 html-withimg-loader 处理图片之后，html 中就不能使用 vm, ejs 的模板了，如果想继续在 html 中使用 <% if(htmlWebpackPlugin.options.config.header) { %> 这样的语法，但是呢，又希望能使用本地图片，可不可以？鱼和熊掌都想要，虽然很多时候，能吃个鱼就不错了，但是这里是可以的哦，像下面这样编写图片的地址，并且删除html-withimg-loader的配置即可。

出现这个问题的原因是我使用了 html-withimg-loader 然后配置后，但是打包后出现了问题，打包后的html成了这个鬼样子，

注释配置卸掉这个node_modules后，报错

但是问题尝试了很多种，无法解决，我没办法又给它装上了，

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <% if(htmlWebpackPlugin.options.config.header) { %>
    <link rel="stylesheet" type="text/css" href="//common/css/header.css">
    <% } %>
    <title><%= (htmlWebpackPlugin.options.config.title) %></title>
</head>

<body>
  <div>20200303</div>
  <!-- <img src="./img/a.jpeg" /> -->
  <img src="<%= require(‘./img/a.jpeg‘) %>" />
</body> 
<% if(htmlWebpackPlugin.options.config.header) { %>
<script src="//common/header.min.js" type="text/javascript"></script> 
<% } %>
</html>

然后

我执行了如下操作

npm uninstall html-withimg-loader

注释掉webpack.config.js里的
          // {
          //   test: /\.html$/,
          //   use: ‘html-withimg-loader‘
          // },         

 注释掉 public/index.html中的

  <!-- <img src="./img/a.jpeg" /> -->
  <!-- <img src="<%= require(‘./img/a.jpeg‘) %>" /> -->

检查一下package.json    确保那个html-withimg-loader正确卸载完毕
实在不行，干脆删掉所有的node_modules   
删掉    package.json     中的  html-withimg-loader
再执行npm i   然后在执行上面的步骤

npm run build
 
然后看页面，已经可以正常显示出<title><%= (htmlWebpackPlugin.options.config.title) %></title> 编译成功的标题了~~~

然后我们再打开

public/index.html中的<img src="./img/a.jpeg" />    
大功告成~~~

好了，问题解决了。

我把我的整体代码放上来~~~

先来个代码总体概览表

--dist
--node_modules
--public
------img
----------a.jpeg
----------my.png
------config.js
------index.html
--src
------assets
----------img
--------------mya.png
------index.js
------index.less
--.babelrc
--package-lock.json
--package.json
--webpack.config.js

原文：https://www.cnblogs.com/sugartang/p/12407765.html