Vue 3 将本地静态文件包含到 index.html 中

如何解决Vue 3 将本地静态文件包含到 index.html 中

<!DOCTYPE html>
<html lang="">
  <head>
    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
    <title><%= htmlWebpackPlugin.options.title %></title>
    <script src="https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.min.js"></script>
    <link rel="stylesheet" href="semantic/dist/semantic.min.css">

我有一个基本的 Vue 3 项目，我想在我的 public/index.html 文件中包含来自根目录的文件（例如 node_modules 或我的 semantic 文件夹）

我在 vue.config.js 文件中尝试了各种配置，但似乎没有一个有效。

module.exports = {
  publicPath: '',}

将自定义本地 css/js 文件包含到 index.hmtl 中而不将它们直接移动到 public 目录的正确方法是什么？

解决方法

我前段时间遇到了类似的问题，我也在这里问过，但我自己找到了解决方案，这里是 link，我是如何使用自己的 webpack 配置的，它可能与您需要的有所不同做，但我认为核心是相同的，文件加载器上的 esModule 选项与我想要加载的本地文件的路径混淆。