到目前为止，我发现最好的方法是将此属性放在config中（HtmlWebpackPlugin选项）：

new HtmlWebpackPlugin({
  ...
  baseUrl: process.env.NODE_ENV == 'development'?'/':'/app/'
})

然后输出到index.html中：

<base href="<%= htmlWebpackPlugin.options.baseUrl %>" />

如果您将template选项设置为HTML文件，则2.x版插件将不执行任何替换。
在这种情况下，您需要修改@stever的答案，如下所示：

new HtmlWebpackPlugin({
  ...
  template: './src/index.ejs',
  baseUrl: process.env.NODE_ENV === 'development'?'/':'/app/'
})

并将index.html文件重命名为index.ejs

现在做起来很容易。
在您的项目中安装base-href-webpack-plugin：

npm install --save-dev base-href-webpack-plugin

并在webpack文件中导入此代码：

// Import package
const { BaseHrefWebpackPlugin } = require('base-href-webpack-plugin'); // Or `import 'base-href-webpack-plugin';` if using typescript

// Add to plugins
plugins: [
  new BaseHrefWebpackPlugin({ baseHref: '/' })
]

参考：https://github.com/dzonatan/base-href-webpack-plugin

在Webpack 4中，我尝试了**HtmlWebpackPlugin中的baseUrl，但它从未在html中解析。因此，您需要一个名为BaseHrefWebpackPlugin**的新插件沿着HtmlWebpackPlugin

网络包配置

new HtmlWebpackPlugin(), //this will create default template
        new HtmlWebpackPlugin({
            title: 'MyApp' //replace title
  
        }),
        new BaseHrefWebpackPlugin({
            baseHref: process.env.NODE_ENV == 'development' ? '/' : '/MyApp/'
        })

HTML

<base href="<%= htmlWebpackPlugin.options.baseUrl %>">
    <title><%= htmlWebpackPlugin.options.title %></title>

如果您使用的是Angular CLI 6，则可以指定baseHref并将url部署为angular.json中生产配置（项目〉xxx〉架构〉构建〉配置〉生产）的一部分。

如果你正在使用webpack，你一定要设置output.publicPath为相同的值。请参阅HtmlWebpackPlugin注入相对路径文件，当加载非根网站路径时会中断

对于Webpack 5，html-webpack-plugin本机支持在文档中设置base标签。
https://github.com/jantimon/html-webpack-plugin#base-tag
base选项可以是：

• 字符串

new HtmlWebpackPlugin({
  'base': process.env.NODE_ENV === 'development' ? '/' : '/MyApp/'
})

• • 对象 *

new HtmlWebpackPlugin({
  'base': { 
    'href': process.env.NODE_ENV === 'development' ? '/' : '/MyApp/'
  }
})

以上配置完全相同，都将在HTML中注入base标记：

<base href="...">

• • 布尔值（假）*

new HtmlWebpackPlugin({
  'base': false
})

默认情况下，该选项设置为false，并且不会注入碱基标记。