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

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

手机验证码登录
找回密码返回
邮箱找回 手机找回
注册账号返回
其他登录方式
分享
  • 收藏
    X
    [已解决]如何用html-webpack-plugin插入自定义代码
    • 2019-04-03 00:00
    • 11
    39
    0

    业务背景

    • 开发静态页面
    • header,footer,nav都是公用的
    • 例如
    <html>
      <head>...</head>
      <body
        <nav>...</nav>
        // 每个页面不同的代码
        <footer>...</footer>
      </body>
    </html>

    存在的麻烦

    • 每次新建一个页面
    • 都要复制这段代码

    问题

    • 通过html-webpack-plugin可以把每个页面都注入到模板文件的指定位置么?
    • 看了下文档,没有这个配置选项~
    • 蒙蔽中~~~### 问题描述

    问题出现的环境背景及自己尝试过哪些方法

    相关代码

    // 请把代码文本粘贴到下方(请勿用图片代替代码)

    你期待的结果是什么?实际看到的错误信息又是什么?

    0
    打赏
    收藏
    点击回答
    您的回答被采纳后将获得:提问者悬赏的 11 元积分
        全部回答
    • 0
    • 轻轻易 普通会员 1楼

      在使用HTML webpack-plugin时,如果你想要在模板中插入自定义代码,你可以通过使用template选项来实现。这个选项允许你使用一个字符串来替换模板中的内容。

      以下是一个例子:

      javascript module.exports = { // ... template: '<div id="myDiv">Hello, World!</div>' };

      在这个例子中,template选项是一个字符串,Hello, World!就是这个字符串的内容。

      然后,你可以像使用任何其他插件一样使用这个插件。例如,你可以在模板中添加以下代码:

      ```html

      ```

      这将替换模板中的<div>元素的内容为Hello, JavaScript!

      请注意,template选项是HTMLwebpack插件的默认选项,如果你没有提供,它将使用默认的模板。如果你想要自定义模板,你可以通过使用customTemplate选项来实现。

    更多回答
    扫一扫访问手机版
    • 回到顶部
    • 回到顶部