YschcmsFront/vite.config.ts

import { defineConfig, loadEnv } from "vite";
import vue from "@vitejs/plugin-vue";
import { createSvgIconsPlugin } from "vite-plugin-svg-icons";
import ViteAutoImport from "unplugin-auto-import/vite";
import { createHtmlPlugin } from "vite-plugin-html";
import UnoCSS from "unocss/vite";
import presetUno from "@unocss/preset-uno";
import presetRemToPx from "@unocss/preset-rem-to-px";
import path from "path";
import { cmsMockPlugin } from "./mock";

// https://vitejs.dev/config/
export default defineConfig(({ command, mode }) => {
    // 构建产物直出 dist/（与 UserBase 同风格）：zip 打包/static/admin 拷贝都取 dist 根，
    // 不再有 dist/base 中间层；dev(serve) 不写产物，两者共用该值无冲突
    const outDir = "dist";
    // VITE_IS_MOCK=true 时启用本地 mock 中间件（拦截 /api、/portal 等，无需后端）
    const mockEnabled = loadEnv(mode, process.cwd(), "VITE_").VITE_IS_MOCK === "true";
    return {
        base: "./", // 相对路径 + hash 路由：支持部署到 /yschcms/admin 任意子路径
        plugins: [
            ...(mockEnabled ? [cmsMockPlugin()] : []),
            vue(),
            createSvgIconsPlugin({
                iconDirs: [path.resolve(process.cwd(), "src/assets/icons")],
                symbolId: "icon-[dir]-[name]",
                inject: "body-last",
                customDomId: "__svg__icons__dom__",
            }),
            ViteAutoImport({
                imports: [
                    "vue",
                    "vue-router",
                    {
                        "view-ui-plus": ["Button", "Table", "Modal", "Message", "Form", "FormItem", "Input", "Select", "Tag"],
                    },
                    { from: "alova/client", imports: ["usePagination", "useRequest", "useWatcher", "useForm"] },
                ],
                dts: "./src/auto-imports.d.ts",
                dirs: ["src/api"],
            }),
            createHtmlPlugin({
                minify: true,
                pages: [
                    {
                        entry: "src/main.ts",
                        template: "index.html",
                        injectOptions: {
                            data: {
                                title: "云海CMS",
                                injectScript: "",
                            },
                        },
                    },
                ],
            }),
            UnoCSS({
                presets: [presetUno(), presetRemToPx({ baseFontSize: 4 })],
                shortcuts: {
                    "h-full": "height:100%",
                    "w-full": "width:100%",
                    "flex-center": "flex justify-center items-center",
                },
                theme: {
                    fontSize: {
                        xs: "0.625rem",
                        sm: "0.75rem",
                        base: "0.875rem",
                        lg: "1rem",
                    },
                },
            }),
        ],
        resolve: {
            alias: {
                "@": path.resolve(__dirname, "./src"),
            },
        },
        server: {
            host: "localhost",
            port: 8073,
            proxy: {
                // 后端 CAS 过滤器对 /api/* 不回 CORS 头，dev 必须同源代理；
                // 本地后端 context-path 为 /cms，/api 改写为 /cms/api
                "/api": {
                    target: "http://localhost:8072",
                    changeOrigin: true,
                    rewrite: (p: string) => p.replace(/^\/api/, "/cms/api"),
                    // 后端 context-path=/cms，验票后 Set-Cookie 的 path=/cms；
                    // 浏览器视角请求 path 是 /api/*，不重写则 cookie 永远不会被携带（CAS 会话死循环）
                    cookiePathRewrite: "/",
                },
                // 编辑器上传/预览也走同源代理（fetch + FormData）；CAS 验票回跳
                // （client-host-url=http://localhost:8073 → /cms/api/**）同样命中此规则，
                // Set-Cookie path=/cms 必须重写为 /，否则 8073 页面视角 /api 请求不带会话
                "/cms": {
                    target: "http://localhost:8072",
                    changeOrigin: true,
                    cookiePathRewrite: "/",
                },
                // 「预览门户」按钮（非 mock）打开 serviceHost(空)/portal/{code}/，
                // 同样落到 dev server，需转发到后端 Thymeleaf 门户；门户匿名访问，无 cookie 处理
                "/portal": {
                    target: "http://localhost:8072",
                    changeOrigin: true,
                    rewrite: (p: string) => "/cms" + p,
                },
            },
        },
        build: {
            outDir,
            target: "modules",
            assetsDir: "assets",
            sourcemap: false,
            minify: "esbuild",
            chunkSizeWarningLimit: 1000,
            cssTarget: "chrome61",
            rollupOptions: {
                output: {
                    chunkFileNames: "static/js/[name]-[hash].js",
                    entryFileNames: "static/js/[name]-[hash].js",
                    assetFileNames: (assetInfo: any) => {
                        const info = assetInfo.name.split(".");
                        const extType = info[info.length - 1];
                        if (/\.(png|jpe?g|gif|svg|webp|ico)(\?.*)?$/.test(assetInfo.name)) {
                            return `static/img/[name].[hash][extname]`;
                        } else if (/\.(ttf|woff2?|eot)(\?.*)?$/.test(assetInfo.name)) {
                            return `static/fonts/[name].[hash][extname]`;
                        }
                        return `static/${extType}/[name]-[hash].[ext]`;
                    },
                },
            },
        },
    };
});