import { fileURLToPath, URL } from 'node:url'; import { defineConfig, loadEnv } from 'vite'; import vue from '@vitejs/plugin-vue'; import { appVersion } from '../../scripts/app-version.mjs'; // Ported from legacy henza_admin/vue.config.js. // The legacy build switched publicPath/outputDir on NODE_ENV=='branch'; in Vite the // equivalent switch is the --mode flag (`pnpm dev:branch` / `pnpm build:branch`), // which src/utils/index.ts reads via import.meta.env.MODE. export default defineConfig(({ mode }) => { const isBranch = mode === 'branch'; // Ports are defined once in the repo-root .env (ADMIN_PANEL_PORT / API_PORT) // — see that file's comment block. envDir points here so `vite` picks it up // even though this app's own directory has no .env of its own. const rootEnv = loadEnv(mode, fileURLToPath(new URL('../..', import.meta.url)), ''); const port = Number(rootEnv.ADMIN_PANEL_PORT ?? 5180); const apiPort = Number(rootEnv.API_PORT ?? 3000); return { envDir: fileURLToPath(new URL('../..', import.meta.url)), // Admin is served on its own subdomain (e.g. adm.bnk…), so assets must be // rooted at `/`. Legacy used publicPath `admin/` because it shared a host // path; keeping that here made index.html request `/admin/assets/…` while // the image only has `/assets/…` → white screen 404. // Branch mode still mounts under `/branch/` when that mode is used. base: isBranch ? '/branch/' : '/', // Build number + «what changed» notes → version.json (scripts/app-version.mjs). plugins: [vue(), appVersion('admin-panel')], resolve: { alias: { '@': fileURLToPath(new URL('./src', import.meta.url)), }, }, css: { preprocessorOptions: { less: { // ant-design-vue 4 dropped LESS theming (modifyVars) for CSS-in-JS design // tokens; the equivalent primary/link/radius tokens now live in // App.vue's . This block only compiles the // app's own farsi.less/utilities.less, which have no LESS variables. javascriptEnabled: true, }, }, }, build: { // Legacy's vue.config.js used outputDir 'dist/export' / 'branchDist/export', // but this app's Dockerfile does `COPY dist /usr/share/nginx/html` and nginx // serves that folder's ROOT. With the build landing in dist/export/, the // root kept whatever index.html was committed there before — a stale // pre-port build — so the deployed panel served that instead of this app. // Build straight into the folder the image actually serves (which is also // what apps/user-app does). outDir: isBranch ? 'branchDist' : 'dist', emptyOutDir: true, sourcemap: false, // legacy: productionSourceMap: false }, server: { host: '0.0.0.0', port, // Never silently fall back to another port — fail loudly instead so a // stuck dev server is obvious rather than moving to a random port. strictPort: true, proxy: { '/api': `http://localhost:${apiPort}`, // Uploaded files (ProductImage.url etc.) are served by the API's own // static handler, not this dev server — without this they 404 in dev // even though production nginx (nginx.conf) already proxies them. '/uploads': `http://localhost:${apiPort}`, }, }, }; });