- 将桌面端模态框组件提取为独立模块 desktop-modal-host.tsx - 将移动端模态框组件提取为独立模块 mobile-modal-host.tsx - 使用懒加载和 Suspense 包装入口页面和模态框组件 - 将 React Query Devtools 改为按需加载 - 配置 Vite 构建优化,设置第三方库分包策略 - 替换 lottie-web 为轻量级版本以减少包体积
94 lines
2.0 KiB
TypeScript
94 lines
2.0 KiB
TypeScript
import { fileURLToPath, URL } from 'node:url'
|
|
import babel from '@rolldown/plugin-babel'
|
|
import tailwindcss from '@tailwindcss/vite'
|
|
import { tanstackRouter } from '@tanstack/router-plugin/vite'
|
|
import react, { reactCompilerPreset } from '@vitejs/plugin-react'
|
|
import { defineConfig } from 'vite'
|
|
|
|
function resolveManualChunk(id: string) {
|
|
if (!id.includes('/node_modules/')) {
|
|
return
|
|
}
|
|
|
|
if (
|
|
id.includes('/node_modules/react/') ||
|
|
id.includes('/node_modules/react-dom/') ||
|
|
id.includes('/node_modules/scheduler/')
|
|
) {
|
|
return 'vendor-react'
|
|
}
|
|
|
|
if (id.includes('/node_modules/@tanstack/')) {
|
|
return 'vendor-tanstack'
|
|
}
|
|
|
|
if (
|
|
id.includes('/node_modules/i18next/') ||
|
|
id.includes('/node_modules/react-i18next/')
|
|
) {
|
|
return 'vendor-i18n'
|
|
}
|
|
|
|
if (
|
|
id.includes('/node_modules/motion/') ||
|
|
id.includes('/node_modules/lottie-web/')
|
|
) {
|
|
return 'vendor-animation'
|
|
}
|
|
|
|
if (
|
|
id.includes('/node_modules/radix-ui/') ||
|
|
id.includes('/node_modules/@radix-ui/')
|
|
) {
|
|
return 'vendor-radix'
|
|
}
|
|
|
|
if (id.includes('/node_modules/lucide-react/')) {
|
|
return 'vendor-icons'
|
|
}
|
|
|
|
return 'vendor'
|
|
}
|
|
|
|
export default defineConfig({
|
|
resolve: {
|
|
alias: {
|
|
'@': fileURLToPath(new URL('./src', import.meta.url)),
|
|
'lottie-web': fileURLToPath(
|
|
new URL(
|
|
'./node_modules/lottie-web/build/player/lottie_light.js',
|
|
import.meta.url,
|
|
),
|
|
),
|
|
},
|
|
},
|
|
server: {
|
|
port: 9999,
|
|
host: '0.0.0.0',
|
|
allowedHosts: ['darlena-nonexpiring-cathie.ngrok-free.dev'],
|
|
proxy: {
|
|
'/api': {
|
|
target: 'https://zihua-api.h55555game.top',
|
|
changeOrigin: true,
|
|
},
|
|
},
|
|
},
|
|
plugins: [
|
|
tanstackRouter({
|
|
target: 'react',
|
|
autoCodeSplitting: true,
|
|
}),
|
|
tailwindcss(),
|
|
react(),
|
|
babel({ presets: [reactCompilerPreset()] }),
|
|
],
|
|
build: {
|
|
outDir: 'zihua-web',
|
|
rolldownOptions: {
|
|
output: {
|
|
manualChunks: resolveManualChunk,
|
|
},
|
|
},
|
|
},
|
|
})
|