好了，我想明白了。把下面的代码放在你想包含js文件的地方：

<% for(var i=0; i < htmlWebpackPlugin.files.js.length; i++) {%>
    <script type="text/javascript" src="<%= htmlWebpackPlugin.files.js[i] %>"></script>
<% } %>

并将HtmlWebpackPlugin选项中的inject设置为false。
请记住，你需要手动注入其他东西（css， meta标签等）。F.e. CSS：

<% for(var i=0; i < htmlWebpackPlugin.files.css.length; i++) {%>
    <link type="text/css" rel="stylesheet" href="<%= htmlWebpackPlugin.files.css[i] %>">
<% } %>

为了解决这个问题，我做了以下事情：
(1)安装HtmlWebpackPlugin（https://www.npmjs.com/package/html-webpack-plugin）

npm i html-webpack-plugin

(2)更新我的webpack配置

module.exports = {
// ...
plugins: [
    // ...
    new HtmlWebpackPlugin({
        template: 'template.html',
        filename: 'file.html',
        inject: false,
        minify: false,
        templateParameters: (compilation, assets) => {
            const css = assets.css.map((filePath) => `<link rel="stylesheet" href="${filePath}" />`).join("\n");
            const js = assets.js.map((filePath) => `<script src="${filePath}"></script>`).join("\n");
            return { css, js };
        },
    }),
  
    }),
    // ...
],};

(3)在我的模板中添加这些标签。这将告诉webpack在哪里放置CSS和JS文件。

<!-- Webpack CSS -->
<%= css %>

<!-- Webpack JS -->
<%= js %>

不知道我是不是太晚了，但是你可以使用script-ext-html-webpack-plugin。这可以将脚本设置为defer，它可以推迟执行，直到DOM被解析。另外，你可以将这个脚本注入到html的head中，以并行方式开始获取它，但在最后执行：

plugins: [
  new HtmlWebpackPlugin({ template: 'template.ejs', inject: 'head'}),
  new ScriptExtHtmlWebpackPlugin({ defaultAttribute: 'defer' }),
]