可能是打包时没有修改前端项目默认的公共基础路径,或者是路由模式不支持。
以Vue3项目为例,
1. 修改默认的公共基础路径
import { fileURLToPath, URL } from 'node:url'
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
// https://vitejs.dev/config/
export default defineConfig({
base:"./",//公共基础路径配置
plugins: [
vue(),
],
resolve: {
alias: {
'@': fileURLToPath(new URL('./src', import.meta.url))
}
}
})
2. 修改为Hash路由模式
Vue3项目,如果添加了Vue-Router依赖,默认生成的代码中是history模式,要将其改为hash模式。
import { createRouter, createWebHashHistory, createWebHistory } from 'vue-router'
import HomeView from '../views/HomeView.vue'
const router = createRouter({
//改为hash模式
history: createWebHashHistory(import.meta.env.BASE_URL),//createWebHistory(import.meta.env.BASE_URL),
routes: [
{
path: '/',
name: 'home',
component: HomeView
},
{
path: '/about',
name: 'about',
// route level code-splitting
// this generates a separate chunk (About.[hash].js) for this route
// which is lazy-loaded when the route is visited.
component: () => import('../views/AboutView.vue')
}
]
})
export default router
暂时发现这两个原因,欢迎小伙伴们补充哈。