1. 选择history模式路由
在创建项目时选择history模式,或者在路由文件里面修改成history模式
// process.env.VUE_APP_BASE_URL为部署的文件夹路径
const router = createRouter({
history: createWebHistory(process.env.VUE_APP_BASE_URL),
routes,
});
2. 设置环境变量
在根目录新建.env.development文件和.env.production文件。在环境变量文件里面设置的变量最好以VUE_APP_开头,以下为官网原话.
请注意,只有 NODE_ENV,BASE_URL 和以 VUE_APP_ 开头的变量将通过 webpack.DefinePlugin 静态地嵌入到客户端侧的代码中。这是为了避免意外公开机器上可能具有相同名称的私钥。
// .env.development文件
VUE_APP_BASE_URL=/wlhao/vue3app
// .env.production文件
VUE_APP_BASE_URL=<