我安装了带有cli的全新vue 3应用程序，其中还包含vue路由器。
在我的网站上，我已经把构建的文件放进了www/dist子文件夹。然后在我的php索引文件中，我手动将所有js/css文件链接到/dist文件夹。
我在组件中有一个图像
<img class="discord-icon" src="@/assets/discord.png">
当我将publicHtml设置为'/dist'时，即使显示图像，一切都正常，但由于某种原因，我的主页被从原来的"重定向；www.page.com"；至"；www.page.com/dist"；
我希望默认"；www.page.com"；在主页上还有工作图片，我该如何实现呢？
编辑：我的路由器配置(通过路由器手动安装的默认配置(
const routes = [
{
path: "/",
name: "Home",
component: Home
}
]
const router = createRouter({
history: createWebHistory(process.env.BASE_URL),
routes
});
更新：在vue discord上，我被建议为此创建.htaccess，遗憾的是，我不够熟练，无法创建一个，甚至不知道它存储在哪个文件夹中。此外，我已经有了另一个，因为我使用的是php框架(Nette(
这就是我现在的工作方式：
"publicPath:"/dist"以及"；历史记录：createWebHistory(process.env.BASE_URL("；项目所在地/dist"；文件夹，所以页面转到www.page.com/dist。我去"www.page.com"；它重定向到"/dist"；但是在html中查找时不生成"/dist/css/cchunk vendors.css"所以所有导入的css都是丢失的但当我点击刷新时(直接访问www.page.com/dist(chunk-vendors.cs已加载。默认情况下，vendors.css不在生成了index.html，所以我猜它是由js完成的。所以我产生了邪恶的想法只需手动将vendors.css链接粘贴到我的产品中index.html和它的工作原理，当我直接去/dist url时最后加载了两次这种风格，哈哈。然后我变得更邪恶了思考并更改为"history:createWebHistory("/"("，重新构建生产，现在我有了漂亮的www.page.com，甚至都是进口的样式正在工作(手动粘贴样式链接(，只是有一种感觉，我会在地狱里燃烧。
以下是vue-cli项目通常是如何构建并推送到服务器的一个小摘要。什么样的配置是重要的，它们的目的是什么。希望它能让你知道如何设置你的项目。
Vue Cli建筑
这就是在常规项目中使用vue-cli:构建的工作方式
vue.config.js
module.exports = {
publicPath: process.env.NODE_ENV === 'production' ? '/final-sub-folder' : '',
// ...
}
上面的配置为dev和prod设置了一个不同的站点URL。prod/final-sub-folder意味着在远程服务器的最终URL上会出现这个子文件夹(例如https://example.com/final-sub-folder(。
当使用Vue Clinpm run build构建时，输出进入/dist文件夹(默认情况下(，并且构建默认设置为prod(因此为process.env.NODE_ENV = 'production'(。
现在，如果您尝试进入本地主机中的dist文件夹(例如，在Apache上(，使用相同publicPath的vue路由器将失败，因为在本地主机上，your-proj/dist是与配置中设置的/final-sub-folder不同的基本URL。因此，它只能在可以匹配基本url的最终服务器中工作。
设置vue路由器
您的vue路由器应始终设置为(此配置用于vue-router@next-对于Vue 3(：
const router = createRouter({
history: createWebHistory(process.env.BASE_URL),
routes
})
因此，它遵循您在vue配置中的一个位置设置的基本URL。
(注意：createWebHistory删除URL中的#(
添加.htaccess
关于.htaccess，通常的做法是在其中设置重定向，以便在您的最终服务器上，直接访问https://example.com/final-sub-folder/a-sub-page将被重定向到您的index.html，该index.html可以加载vue路由器，该路由器将处理您在URL中输入的路由匹配。https://router.vuejs.org/guide/essentials/history-mode.html#example-服务器配置
如果没有这个.htaccess，就无法从子文件夹访问Vue路由器，因为它在服务器上不存在(这是一个使用重写引擎的虚拟路由(，这将导致找不到URL。
以下是.htaccess的一个简单示例：
Options +FollowSymlinks
Options -Indexes
RewriteEngine On
RewriteRule .(js|css|map|jpe?g|svg|gif|png|eot|ttf|woff2?)(?.*)?$ - [NC,QSA,L]
RewriteRule .* index.html [NC,QSA,L]
重要的是最后一行将任何内容重定向到index.html(它是从vue-cli构建中生成的(。前一行允许不重定向任何资产文件(vue-router不应处理任何资产文件(。
希望它能帮助你理解！；(