将 vue 项目部署在子路径（二级目录）

项目打包后默认只能部署在服务器根路径，如果想 http://localhost:5173/admin/ 这种形式，可以根据 vite、vue-router 文档介绍进行配置。

1、在 vite.config.js 中配置：

// ......省略其它代码
export default defineConfig(({ command }) => {
    return {
        // 在这里增加 base 写子路径
        base: '/admin/',  // 注意这里前后都要有斜杠
        // ......省略其它代码
        resolve: { /*......省略*/ }
        // 如果要修改打包后的输出目录可以加这个配置
        build: {
            outDir: 'admin'  // 默认是 dist
        }
    };
});

2、然后在 src/router/index.js 中增加：

// ......省略其它代码
const router = createRouter({
    routes,
    // 给 createWebHistory 方法传参数配置子路径
    history: createWebHistory(import.meta.env.BASE_URL)
});

3、然后重新运行(run dev)或者打包(run build)部署后再访问就可以带上配置的子路径了，也可以在打包的时候动态设置子路径：

npm run build --base=/admin/