¶Ô±ÈÐÂÎļþ |
| | |
| | | import { defineConfig, loadEnv, createLogger } from 'vite' |
| | | import vue from '@vitejs/plugin-vue' |
| | | import vueJsx from '@vitejs/plugin-vue-jsx' |
| | | import path from 'path' |
| | | import Components from 'unplugin-vue-components/vite' |
| | | import { ElementPlusResolver } from 'unplugin-vue-components/resolvers' |
| | | import qiankun from 'vite-plugin-qiankun' |
| | | import pkg from './package.json' |
| | | import { optimizeLodashImports } from '@optimize-lodash/rollup-plugin' |
| | | import VueTypeImports from 'vite-plugin-vue-type-imports' |
| | | import { ChildProcess } from 'child_process' |
| | | import slash from 'slash' |
| | | const kill = require('kill-port') |
| | | const crossSpawn = require('cross-spawn') |
| | | |
| | | const isWin = process.platform === 'win32' |
| | | const appPath = slash(path.resolve(process.cwd(), 'app')) |
| | | |
| | | const getPort: () => Promise<string> = () => { |
| | | const child: ChildProcess = crossSpawn( |
| | | isWin |
| | | ? '..\\node_modules\\lmes-create-widget\\port' |
| | | : '../node_modules/lmes-create-widget/port', |
| | | [], //æ·»å 端å£åç¯å¢åéåæ° |
| | | { |
| | | cwd: appPath, |
| | | shell: true, |
| | | env: { |
| | | ENV: 'production', |
| | | }, |
| | | } |
| | | ) |
| | | |
| | | let output = '' |
| | | return new Promise((resolve, reject) => { |
| | | // è·ååè¿ç¨çæ åè¾åº |
| | | child.stdout?.on('data', (data) => { |
| | | output += data.toString() |
| | | }) |
| | | |
| | | child.stderr?.on('data', (data) => { |
| | | console.error('stderr:', data.toString()) |
| | | }) |
| | | |
| | | child.on('close', (code) => { |
| | | if (code === 0) { |
| | | const port = output.split('\n')[0] |
| | | console.log('PROJECT_PORT:', port) |
| | | resolve(port) |
| | | } else { |
| | | reject(code) |
| | | } |
| | | }) |
| | | }) |
| | | } |
| | | |
| | | const runGoServer = (projectPort: string) => { |
| | | const child: ChildProcess = crossSpawn( |
| | | isWin |
| | | ? `..\\node_modules\\lmes-create-widget\\www ${projectPort}` |
| | | : `../node_modules/lmes-create-widget/www ${projectPort}`, |
| | | [], //æ·»å 端å£åç¯å¢åéåæ° |
| | | { |
| | | stdio: 'inherit', |
| | | cwd: appPath, |
| | | shell: true, |
| | | env: { |
| | | ENV: 'production', |
| | | }, |
| | | } |
| | | ) |
| | | return child |
| | | } |
| | | /** |
| | | * ææ»goLangæå¡ï¼8800ç«¯å£ |
| | | */ |
| | | const killGoServer = async (port: number) => { |
| | | try { |
| | | console.log('æ£æµå° Ctrl+Cï¼è¿ç¨å³å°éåº...') |
| | | await kill(port) |
| | | process.exit(0) |
| | | } catch (error) { |
| | | process.exit(0) |
| | | } |
| | | } |
| | | const run = (projectPort: string) => { |
| | | try { |
| | | runGoServer(projectPort) |
| | | let lastPressTime = Date.now() |
| | | process.on('SIGINT', async () => { |
| | | const currentTime = Date.now() |
| | | if (lastPressTime && currentTime - lastPressTime < 2000) { |
| | | killGoServer(Number(projectPort)) |
| | | } else { |
| | | lastPressTime = Date.now() |
| | | } |
| | | }) |
| | | process.on('SIGTERM', () => { |
| | | console.log('è¿ç¨è¢« kill ç»æ¢...') |
| | | killGoServer(Number(projectPort)) |
| | | }) |
| | | } catch (error) { |
| | | console.error(error) |
| | | } |
| | | } |
| | | // @ts-ignore |
| | | export default defineConfig(async ({ mode }) => { |
| | | const projectPort = await getPort() |
| | | run(projectPort) |
| | | const env = loadEnv(mode, __dirname) |
| | | console.info('[mode]', mode) |
| | | console.info('[env]', env) |
| | | |
| | | return { |
| | | // base: `//localhost:${env.VITE_PORT}/`, |
| | | base: '/', |
| | | plugins: [ |
| | | // requireTransform({}), |
| | | vueJsx(), |
| | | vue({ |
| | | // @ts-ignore |
| | | reactivityTransform: path.resolve(__dirname, 'src'), |
| | | }), |
| | | VueTypeImports(), |
| | | |
| | | Components({ |
| | | include: [/\.vue$/, /\.vue\?vue/, /\.md$/, /\.tsx/, /\.jsx/], |
| | | resolvers: [ |
| | | ElementPlusResolver({ |
| | | importStyle: 'sass', |
| | | }), |
| | | ], |
| | | }), |
| | | { |
| | | name: 'fixHMR', |
| | | handleHotUpdate({ modules, file }) { |
| | | if (file.match(/\.(js|ts|css)$/)) return modules |
| | | |
| | | modules.map((m) => { |
| | | m.importers = new Set() |
| | | }) |
| | | }, |
| | | }, |
| | | // qiankun(pkg.name, { |
| | | // useDevMode: true, |
| | | // }), |
| | | optimizeLodashImports(), |
| | | ], |
| | | resolve: { |
| | | alias: { |
| | | '@': path.resolve(__dirname, './src'), |
| | | components: path.resolve(__dirname, './src/components'), |
| | | sdk: path.resolve(__dirname, 'src/cms/sdk.es.js'), |
| | | }, |
| | | }, |
| | | server: { |
| | | host: '0.0.0.0', |
| | | headers: { |
| | | 'Access-Control-Allow-Origin': '*', |
| | | }, |
| | | origin: `//localhost:${env.VITE_PORT}`, |
| | | // open: true, |
| | | port: env.VITE_PORT, |
| | | cors: true, |
| | | proxy: { |
| | | // ä½¿ç¨æ¬å°å¤è¯è¨æä»¶æ¶å¼å¯ |
| | | '/api/v1/multiplelanguage/static': { |
| | | target: 'http://localhost:8001/language/Common.en-US.json', |
| | | changeOrigin: true, |
| | | rewrite: (path) => |
| | | path.replace(/^\/api\/v1\/multiplelanguage\/static/, ''), |
| | | }, |
| | | '/api': { |
| | | target: env.VITE_API_URL, |
| | | changeOrigin: true, |
| | | }, |
| | | '/hubs': { |
| | | target: env.VITE_API_URL, |
| | | changeOrigin: true, |
| | | ws: true, |
| | | }, |
| | | '/projectApi': { |
| | | target: `http://127.0.0.1:${projectPort}`, |
| | | changeOrigin: true, |
| | | ws: true, |
| | | }, |
| | | }, |
| | | }, |
| | | build: { |
| | | outDir: 'wwwroot', |
| | | minify: 'esbuild', |
| | | sourcemap: true, |
| | | chunkSizeWarningLimit: 1500, |
| | | target: 'ES2022', |
| | | rollupOptions: { |
| | | output: { |
| | | entryFileNames: `index.js`, |
| | | }, |
| | | }, |
| | | }, |
| | | esbuild: { |
| | | drop: mode !== 'development' ? ['console', 'debugger'] : [], |
| | | keepNames: true, |
| | | }, |
| | | css: { |
| | | // postcss: { |
| | | // plugins: [ |
| | | // PurgeCSS({ |
| | | // // PurgeCSS options here |
| | | // content: ['./index.html', './src/**/*.{vue,js,ts,jsx,tsx}'], |
| | | // }), |
| | | // ], |
| | | // }, |
| | | preprocessorOptions: { |
| | | scss: { |
| | | additionalData: ` |
| | | @use "@/assets/styles/element.scss" as *; |
| | | `, |
| | | }, |
| | | }, |
| | | }, |
| | | } |
| | | }) |