149 lines
4.0 KiB
TypeScript
149 lines
4.0 KiB
TypeScript
import { resolve } from 'path';
|
|
import { defineConfig } from 'vite';
|
|
import vue from '@vitejs/plugin-vue';
|
|
import vueJsx from '@vitejs/plugin-vue-jsx';
|
|
import { viteCommonjs } from '@originjs/vite-plugin-commonjs';
|
|
import tailwindcss from '@tailwindcss/vite';
|
|
import dts from 'vite-plugin-dts';
|
|
import autoImport from 'unplugin-auto-import/vite';
|
|
import components from 'unplugin-vue-components/vite';
|
|
import { AntDesignVueResolver } from 'unplugin-vue-components/resolvers';
|
|
import { viteMockServe } from 'vite-plugin-mock';
|
|
|
|
const projectPath = resolve(__dirname)
|
|
|
|
export default defineConfig({
|
|
base: '/',
|
|
resolve: {
|
|
alias: {
|
|
'@': `${projectPath}/src`
|
|
}
|
|
},
|
|
server: {
|
|
host: true, // 等价于 0.0.0.0，允许所有网卡访问
|
|
port: 8888,
|
|
open: false,
|
|
cors: true,
|
|
strictPort: true,
|
|
allowedHosts: [
|
|
'monitor.kernelstudio.com',
|
|
'127.0.0.1',
|
|
],
|
|
// 修复 HMR 配置：简化 WS 连接逻辑，让 Vite 自动适配
|
|
hmr: {
|
|
host: 'monitor.kernelstudio.com',
|
|
port: 8888, // Nginx 监听的端口
|
|
protocol: 'ws', // 显式指定 WS 协议
|
|
path: '/ws', // Vite HMR 的 WS 路径（关键）
|
|
},
|
|
// 修复响应头：跨域头匹配实际访问域名
|
|
headers: {
|
|
// 'X-Frame-Options': 'sameorigin',
|
|
// 开发环境放行所有跨域（更通用），替代原有的 127.0.0.1:8888
|
|
'Access-Control-Allow-Origin': '*',
|
|
'Access-Control-Allow-Methods': 'GET,POST,PUT,DELETE,OPTIONS',
|
|
'Access-Control-Allow-Headers': 'Content-Type,Authorization',
|
|
},
|
|
// 移除无效的 /api 代理配置（原 target: /api 无意义）
|
|
// 如需代理 /api 到 3000 端口，正确配置如下（可选）：
|
|
proxy: {
|
|
'/api': {
|
|
target: 'http://127.0.0.1:1777', // Prometheus 地址
|
|
changeOrigin: true,
|
|
ws: true,
|
|
},
|
|
'/login': {
|
|
target: 'http://127.0.0.1:1777',
|
|
changeOrigin: true, //是否跨域
|
|
},
|
|
'/getInfo': {
|
|
target: 'http://127.0.0.1:1777',
|
|
changeOrigin: true,
|
|
ws: true,
|
|
},
|
|
'/api/live/ws': {
|
|
target: 'http://127.0.0.1:3000',
|
|
changeOrigin: true,
|
|
ws: true,
|
|
},
|
|
},
|
|
watch: {
|
|
ignored: [],
|
|
}
|
|
},
|
|
css: {
|
|
preprocessorOptions: {
|
|
less: {
|
|
javascriptEnabled: true
|
|
}
|
|
}
|
|
},
|
|
build: {
|
|
rollupOptions: {
|
|
output: {
|
|
entryFileNames: 'assets/js/[name].[hash].js',
|
|
chunkFileNames: 'assets/js/[name].[hash].js',
|
|
assetFileNames: (assetInfo) => {
|
|
if (/\.(css|less|scss|sass)$/.test(assetInfo.name || '')) {
|
|
return 'assets/css/[name].[hash].[ext]';
|
|
}
|
|
if (/\.(woff|woff2|ttf|eot|otf)$/.test(assetInfo.name || '')) {
|
|
return 'assets/fonts/[name].[hash].[ext]';
|
|
}
|
|
if (/\.(jpg|jpeg|png|icon|gif|svg)$/.test(assetInfo.name || '')) {
|
|
return 'assets/images/[name].[hash].[ext]';
|
|
}
|
|
return 'assets/bundled/[name].[hash].[ext]';
|
|
}
|
|
}
|
|
}
|
|
},
|
|
plugins: [
|
|
vue(),
|
|
viteCommonjs(),
|
|
tailwindcss(),
|
|
vueJsx({
|
|
transformOn: true,
|
|
optimize: true,
|
|
}),
|
|
viteMockServe({
|
|
mockPath: `${projectPath}/mock`,
|
|
enable: true,
|
|
}),
|
|
dts({
|
|
tsconfigPath: `${projectPath}/tsconfig.json`,
|
|
outDir: `${projectPath}/types`,
|
|
}),
|
|
autoImport({
|
|
dts: `${projectPath}/types/auto-imports.d.ts`,
|
|
eslintrc: {enabled: true},
|
|
vueTemplate: true,
|
|
ignore: ['h'],
|
|
include: [
|
|
/\.[tj]sx?$/,
|
|
/\.vue$/,
|
|
],
|
|
resolvers: [
|
|
AntDesignVueResolver({importStyle: false}),
|
|
],
|
|
imports: [
|
|
'vue',
|
|
'vue-router',
|
|
'pinia',
|
|
{
|
|
'@vueuse/core': ['useLocalStorage', 'useClipboard', 'useDebounceFn'],
|
|
},
|
|
],
|
|
}),
|
|
components({
|
|
directives: true,
|
|
extensions: ['vue'],
|
|
resolvers: [
|
|
AntDesignVueResolver({
|
|
importStyle: false,
|
|
}),
|
|
],
|
|
dts: `${projectPath}/types/components.d.ts`
|
|
})
|
|
],
|
|
}) |