html-webpack-plugin, 嵌套引入 html, 无法解析
index.html
<div class="center-table-wrapper">
<%= require('html-loader!../components/systemMainTab/index.html') %></div>systemMainTab/index.html
<div class="containerDY">
<div class="container-list">
<div class="container-table">
<table id="showTable" style="width:100%"></table>
</div>
<div class="container-pagination">
<!-- 无法引入html 内容 -->
<%= require('html-loader!../systemPagination/index.html') %>
</div>
</div>
<!-- <div class="container-dy">
</div> --></div>systemPagination/index.html
<div class="system-pagination"></div>
第一层 <%= require('html-loader!../components/systemMainTab/index.html') %> 能正常引入, 而systemMainTab/index.html 的 <%= require('html-loader!../systemPagination/index.html') %> 未能解析, 有什么方法能嵌套解析否?
一种方式是通过 js 来引入模块在组装, 不过这种方式实现不佳
鸿蒙传说浏览 1657回答 1
1回答
-
慕标5832272
你既然已经用了 html-loader 了，实际上就不需要通过 html-webpack-plugin 的模板来渲染 html 了。在 webpack 里配置 html-loader 开启 interpolate 后，通过 ES6 字符串模板进行引用。webpack:{ test: /\.html$/, use: [{ loader: "html-loader", options: { interpolate: true } }]}html:<!DOCTYPE html><html lang="en"><head> ${require("./common.html")}</head>然后在 common.html 中，可以继续使用 ${require("xxx.html")} 进行引用。这个写起来应该比你用 <%= ... %> 更简洁一些。
随时随地看视频慕课网APP
相关分类
Node.js