【问题标题】:Is there any webpack plugin can resolve static source in html file?是否有任何 webpack 插件可以解析 html 文件中的静态源?
【发布时间】:2017-04-25 16:04:24
【问题描述】:

例如html包含以下内容

<div class="logo-wrap">
    <!-- /dev is developing directory -->
    <img src="/dev/logo.png">
</div>

解决后。变成了

<div class="logo-wrap">
    <!-- /static is deploying directory and a3z51b2l is file's hash -->
    <!-- meanwhile, it moves logo.png from /dev directory to /static directory -->
    <img src="/static/logo.a3z51b2l.png">
</div>

有没有插件可以做到这一点?

【问题讨论】:

    标签: webpack frontend


    【解决方案1】:

    是的,在静态 HTML 文件中,您可以使用 html-webpack-plugin。默认情况下它使用 EJS 语法,所以在你的 html 文件中你可以这样做:

    <img src="<%= require('./local/path/to/img.png') %>" />
    

    并且 webpack 会构建一个具有正确路径的静态 HTML 文件。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2017-04-28
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2023-03-15
      • 2017-12-22
      • 1970-01-01
      相关资源
      最近更新 更多