Webpack 动态要求给出混合内容错误

Webpack dynamic require gives Mixed Content error

我正在尝试 Webpacks 动态需求,它将我需要的任何东西变成一个动态模块并拆分代码。

import(`resources/assets/images/svg/${this.name}.svg`).then((module) => {
    this.svg = module;
}).catch(error => 'An error occured while loading the svg');

当 promise 触发时,代码将被注入带有脚本标签的页面中。除了脚本标签使用 http 而不是 https.

Mixed Content: The page at 'https://test.app' was loaded over HTTPS, but requested an insecure script 'http://test.app/28.js'. This request has been blocked; the content must be served over HTTPS.

如何确保我的动态要求使用 https。这是我可以在我的 webpack 配置中调整的设置吗?

更新:

这不是 http 或 https 问题,而是 Webpack 创建了一个没有 / 前缀的脚本标签:

<script type="text/javascript" charset="utf-8" async="" src="22.js"></script>

这导致脚本解析为:

mywebpage.app/test/22js

虽然实际上需要:

mywebpage.app/22.js

虽然我不知道如何解决这个问题。

通过使用解决:

output: {
    publicPath: '/'
}

我希望这不会与其他任何内容冲突。