webpack 插件HtmlWebpackPlugin配置問題

配置代碼

new HtmlWebpackPlugin({
      filename: 'index.html',
      template: 'www/index.html',
      inject: true,
      chunks: ['index','manifest','vendor'],
      minify: {
        removeComments: true,
        collapseWhitespace: true,
        removeAttributeQuotes: true
      },
      chunksSortMode: 'dependency'
    })

插入后代碼,插入后的代碼是絕對路勁,怎麽調整為相對路徑
配置代碼效果

<html>

    <head>
        <meta charset=utf-8>
        <meta name=viewport content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
        <meta name=apple-mobile-web-app-capable content=yes>
        <meta name=apple-mobile-web-app-status-bar-style content=black>
        <link href=/static/css/index.c7b44a78814ecafda35f58784609e1af.css rel=stylesheet>
    </head>

    <body>
        <script type=text/javascript src=/static/js/manifest.fbb49042b23710e35851.js></script>
        <script type=text/javascript src=/static/js/vendor.86fada0c2baad29021e8.js></script>
        <script type=text/javascript src=/static/js/index.86db0e5c40c094ba920a.js></script>
    </body>

</html>

想要的最終效果

<!DOCTYPE html>
<html>

    <head>
        <meta charset=utf-8>
        <meta name=viewport content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
        <meta name=apple-mobile-web-app-capable content=yes>
        <meta name=apple-mobile-web-app-status-bar-style content=black>
        <link href=./static/css/index.c7b44a78814ecafda35f58784609e1af.css rel=stylesheet>
    </head>

    <body>
        <script type=text/javascript src=./static/js/manifest.fbb49042b23710e35851.js></script>
        <script type=text/javascript src=./static/js/vendor.86fada0c2baad29021e8.js></script>
        <script type=text/javascript src=./static/js/index.86db0e5c40c094ba920a.js></script>
    </body>

</html>
阅读 3.7k
2 个回答

publicPath 默认是 '/'

把publicPath改成 './' 就行了

有可能是你 webpack.config.js 中 output 配置项的问题,也有可能是你 template 模板的问题

需要提供完整的 webpack.config.js 和 template 模板

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进