Webpack Html网页包插件模板：模块生成失败：语法错误：意外标记_Webpack_Html Webpack Plugin

Webpack Html网页包插件模板：模块生成失败：语法错误：意外标记

webpack

Webpack Html网页包插件模板：模块生成失败：语法错误：意外标记,webpack,html-webpack-plugin,Webpack,Html Webpack Plugin,当我尝试使用index.ejs模板文件构建html webpack插件时，抛出以下错误：即使我尝试加载为.html文件或安装ejs加载程序，仍然会失败。我不确定ejs loader是否安装了html网页包插件其他一些人也有同样的问题，但他们的网页版本是@1，该链接上的解决方案对我不起作用错误 ./node_modules/html网页包插件/lib/loader.js/src/index.ejs <!DOCTYPE html> <html> <head&

当我尝试使用index.ejs模板文件构建html webpack插件时，抛出以下错误：

即使我尝试加载为.html文件或安装ejs加载程序，仍然会失败。我不确定ejs loader是否安装了html网页包插件

其他一些人也有同样的问题，但他们的网页版本是@1，该链接上的解决方案对我不起作用

错误 ./node_modules/html网页包插件/lib/loader.js/src/index.ejs

<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="/assets/css/bootstrap.min.css">
    <title>My Library</title>
  </head>
  <body>
    <div class="main-content"></div>
    <footer class="footer-container"><p><span>Source: </span><a href="https://github.com/arikanmstf/mylibrary">https://github.com/arikanmstf/mylibrary</a></p></footer>
  </body>
</html>

模块生成失败：语法错误：意外令牌（1:1）

src/index.ejs

<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="/assets/css/bootstrap.min.css">
    <title>My Library</title>
  </head>
  <body>
    <div class="main-content"></div>
    <footer class="footer-container"><p><span>Source: </span><a href="https://github.com/arikanmstf/mylibrary">https://github.com/arikanmstf/mylibrary</a></p></footer>
  </body>
</html>

package.json依赖项：

"devDependencies": {
    "babel-core": "^6.2.1",
    "babel-eslint": "7.2.3",
    "babel-loader": "^7.1.0",
    "babel-preset-es2015": "^6.1.18",
    "babel-preset-react": "^6.1.18",
    "chai": "^3.5.0",
    "chai-jquery": "^2.0.0",
    "css-loader": "^0.28.4",
    "eslint": "3.19.0",
    "eslint-config-airbnb": "15.0.1",
    "eslint-loader": "1.7.1",
    "eslint-plugin-import": "^2.7.0",
    "eslint-plugin-jsx-a11y": "5.0.3",
    "eslint-plugin-react": "7.0.1",
    "extract-text-webpack-plugin": "^3.0.0",
    "file-loader": "^0.11.2",
    "html-webpack-plugin": "^2.29.0",
    "jquery": "^2.2.1",
    "jsdom": "^8.1.0",
    "mocha": "^2.4.5",
    "node-sass": "^4.5.3",
    "react-router-dom": "^4.1.1",
    "sass-loader": "^6.0.5",
    "style-loader": "^0.18.1",
    "uglifyjs-webpack-plugin": "^0.4.3",
    "webpack": "^3.3.0",
    "webpack-dev-server": "^2.6.1",
    "yargs": "^8.0.1"
  },
  "dependencies": {
    "axios": "^0.16.1",
    "babel-preset-stage-1": "^6.1.18",
    "prop-types": "^15.5.10",
    "qs": "^6.4.0",
    "react": "^15.6.1",
    "react-dom": "^15.6.1",
    "react-dropzone": "^3.13.3",
    "react-redux": "^5.0.5",
    "react-router": "^4.1.1",
    "redux": "^3.6.0",
    "redux-thunk": "^2.2.0"
  }

您忘记在您的规则中为

babel loader

添加

test

属性，这意味着它应用于所有文件，而babel不处理HTML。从技术上讲，它将其解释为JSX，但

不是有效的JSX，因为JavaScript标识符不能包含


因为您已经有了.js（x）
的正则表达式，所以规则应该是（我还将query
更改为options
，因为，但仍然有效）：
如果你在插件中打开错误日志，你会得到更多的信息吗？新的HtmlWebpackPlugin（{template:'src/index.ejs'，batherRors:true}）相同：BabelLoaderError:SyntaxError:Unexpected token（1:1）我对webpack配置有点生疏，但我想发生的是，您的模板被捆绑到一个JS文件中，而babel加载程序无法解析该文件。如果在HtmlWebpackPlugin中指定html文件名，是否会出现完全相同的错误？（例如新的HtmlWebpackPlugin（{template:'src/index.ejs'，filename:'index_Generated.html'））我同意。（新的HtmlWebpackPlugin（{template:'src/index.ejs'，filename:'index_Generated.html'）仍然失败。
{
  test: JS_JSX_PATTERN,
  exclude: /node_modules/,
  loader: "babel-loader",
  options: {
    presets: ["react", "es2015", "stage-1"]
  }
},