账号密码登录
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
找回密码返回
邮箱找回手机找回
注册账号返回
其他登录方式
分享
  • 收藏
    X
    html-webpack-plugin, 嵌套引入 html, 无法解析
    30
    0

    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 来引入模块在组装, 不过这种方式实现不佳

    0
    打赏
    收藏
    点击回答
        全部回答
    • 0
    • 若是爱过 普通会员 1楼

      html-webpack-plugin 是一个用于处理 HTML 的插件,它可以为 HTML 页面添加样式和 JavaScript 代码。如果 html-webpack-plugin 插件无法解析嵌套的 HTML,请尝试以下解决方案:

      1. 尝试在每个嵌套的 HTML 模板中使用<template>标签,例如:

      ```html

      This is a paragraph

      ```

      1. 如果你使用的是 Vue.js,请确保你的 HTML 和 Vue.js 都使用了 html 标签,以避免它们被识别为不同的文件。

      2. 如果你使用的是 React,请确保你的 HTML 和 React 都使用了 html 标签,并且每个模板都包含一个 <script> 标签,以触发 React 的解析。

      3. 如果你的 HTML 模板中包含外部资源(如图片、视频等),请确保它们在 HTML 文件的最后,而不是在模板中。

      4. 如果你使用的是 CSS,并且你使用了 !important,请确保它只影响当前元素,而不是整个页面。

      5. 如果你的 CSS 使用了 !important,请确保它只影响当前元素,而不是整个页面。

      6. 如果你使用的是 JavaScript,并且你使用了 !important,请确保它只影响当前元素,而不是整个页面。

      如果以上方法都无法解决问题,请尝试联系 html-webpack-plugin 的开发者或者查阅更多的文档和教程,以获取更具体的帮助。

    • 胖元帅 普通会员 2楼

      html-webpack-plugin 是一个用于处理 HTML 的插件,它可以为 HTML 页面添加样式和 JavaScript 代码。如果 html-webpack-plugin 插件无法解析嵌套的 HTML,请尝试以下解决方案:

      1. 尝试在每个嵌套的 HTML 模板中使用<template>标签,例如:

      ```html

      This is a paragraph

      ```

      1. 如果你使用的是 Vue.js,请确保你的 HTML 和 Vue.js 都使用了 html 标签,以避免它们被识别为不同的文件。

      2. 如果你使用的是 React,请确保你的 HTML 和 React 都使用了 html 标签,并且每个模板都包含一个 <script> 标签,以触发 React 的解析。

      3. 如果你的 HTML 模板中包含外部资源(如图片、视频等),请确保它们在 HTML 文件的最后,而不是在模板中。

      4. 如果你使用的是 CSS,并且你使用了 !important,请确保它只影响当前元素,而不是整个页面。

      5. 如果你的 CSS 使用了 !important,请确保它只影响当前元素,而不是整个页面。

      6. 如果你使用的是 JavaScript,并且你使用了 !important,请确保它只影响当前元素,而不是整个页面。

      如果以上方法都无法解决问题,请尝试联系 html-webpack-plugin 的开发者或者查阅更多的文档和教程,以获取更具体的帮助。

    更多回答
    扫一扫访问手机版