Pargar/vite.config.ts

import UnoCSS from 'unocss/vite'
import {defineConfig,loadEnv} from 'vite'
import vue from '@vitejs/plugin-vue'
import vueJsx from '@vitejs/plugin-vue-jsx'
import Components from 'unplugin-vue-components/vite'
import {AntDesignVueResolver, VantResolver} from 'unplugin-vue-components/resolvers'
import AutoImport from 'unplugin-auto-import/vite'
import {fileURLToPath, URL} from "node:url"
import {resolve} from "pathe"
import { builtinModules } from 'module';
import {VitePWA} from "vite-plugin-pwa";
// console.log('hi',process.env.VITE_PROJECT_BASE)
// https://vitejs.dev/config/

export default defineConfig(({mode})=> {
    const env = loadEnv(mode, process.cwd(), '')
    // console.log('hi',mode)
    const projectBase = env.VITE_PROJECT_BASE
    console.log('projectBase',projectBase)

    return {
        plugins: [
            vue(),
            /*        UnoCSS({
                        configFile: './uno.config.ts',
                    }),*/
            vueJsx(),
            VitePWA({
                registerType: 'autoUpdate',
                devOptions: {
                    enabled: true
                },
                injectManifest: {
                    maximumFileSizeToCacheInBytes: 5 * 1024 * 1024,
                },
                workbox: {
                    cleanupOutdatedCaches: true,
                    clientsClaim: true,
                    skipWaiting: true,
                },
                mode: 'development',
                base: '/user',
                srcDir: 'src',
                filename: 'sw.ts',
                includeAssets: ['/favicon.png'],
                strategies: 'injectManifest',
                manifest: {
                    name: projectBase,
                    short_name: projectBase,
                    theme_color: '#ffffff',
                    start_url: '/',
                    display: 'standalone',
                    background_color: '#ffffff',
                    icons: [
                        {
                            src: `pwa-icon-36_${projectBase}.png`,
                            sizes: '32x32',
                            type: 'image/png',
                        },
                        {
                            src: `pwa-icon-36_${projectBase}.png`,
                            sizes: '36x36',
                            type: 'image/png',
                            purpose: 'any maskable',

                        },
                        {
                            src: `pwa-icon-192_${projectBase}.png`,
                            sizes: '192x192',
                            type: 'image/png',
                        },
                        {
                            src: `pwa-icon-512_${projectBase}.png`,
                            sizes: '512x512',
                            type: 'image/png',
                            purpose: 'any maskable'
                        },
                    ],
                },
            }),
            UnoCSS({
                configFile: './uno.config.ts',
            }),
            Components({
                dts: true,
                resolvers: [
                    AntDesignVueResolver({importStyle: 'less'}),
                    VantResolver(),
                ]
            }),
            AutoImport({
                // targets to transform
                include: [
                    /\.[tj]sx?$/, // .ts, .tsx, .js, .jsx
                    /\.vue$/,
                    /\.vue\?vue/, // .vue
                    /\.md$/, // .md
                ],
                // global imports to register
                imports: [
                    // presets
                    'vue',
                ],
                // Auto import for module exports under directories
                // by default it only scan one level of modules under the directory
                dirs: [
                    //"./src",
                    // './hooks',
                    // './composables' // only root modules
                    // './composables/**', // all nested modules
                    // ...
                ],

                // Filepath to generate corresponding .d.ts file.
                // Defaults to './auto-imports.d.ts' when `typescript` is installed locally.
                // Set `false` to disable.
                dts: './auto-imports.d.ts',

                // Auto import inside Vue template
                // see https://github.com/unjs/unimport/pull/15 and https://github.com/unjs/unimport/pull/72
                vueTemplate: true,

                // Custom resolvers, compatible with `unplugin-vue-components`
                // see https://github.com/antfu/unplugin-auto-import/pull/23/
                resolvers: [
                    // /!* ... */
                ],

                // Generate corresponding .eslintrc-auto-import.json file.
                // eslint globals Docs - https://eslint.org/docs/user-guide/configuring/language-options#specifying-globals
                eslintrc: {
                    enabled: true, // Default `false`
                    filepath: './.eslintrc-auto-import.json', // Default `./.eslintrc-auto-import.json`
                    globalsPropValue: true, // Default `true`, (true | false | 'readonly' | 'readable' | 'writable' | 'writeable')
                },
            }),
        ],
        resolve: {
            extensions: ['*', '.js', '.vue', '.json', '.ts', '.tsx', '.mjs'],
            alias: {
                '@': fileURLToPath(new URL('./src', import.meta.url)),
                '@assets': fileURLToPath(new URL('./src/assets', import.meta.url)),
                '~': fileURLToPath(new URL('./node_modules', import.meta.url)),
            },
        },
        css: {
            preprocessorOptions: {
                less: {
                    modifyVars: {
                        // Used for global import to avoid the need to import each style file separately
                        // reference:  Avoid repeated references
                        hack: ` ; @import (reference) "${resolve('./src/assets/css/var.less')}"`,
                    },
                    javascriptEnabled: true,
                },
            },
        },
        build: {
            sourcemap: false,
        },
        server: {
            port: 3100
        },
        base:'/user',
    }
})