vite 基础配置
vite.config.js 的基本配置
import { defineConfig } from "vite";
import react from "@vitejs/plugin-react-swc";
import path from "path";
// https://vitejs.dev/config/
export default defineConfig({
plugins: [react()],
// 构建配置
build: {
// 构建后的 js 所在的目录
assetsDir: "",
},
// 开发或生产环境服务的公共基础路径 这个相当于 vue 中的 publicPath
base: "./",
resolve: {
// @ 映射 到 src 路径下
alias: {
"@": path.resolve(__dirname, "src"),
},
},
});
其中在配置 映射的时候 注意要在 tsconfig.json 中配置 paths
{
"compilerOptions": {
"target": "ESNext",
"useDefineForClassFields": true,
"lib": ["DOM", "DOM.Iterable", "ESNext"],
"allowJs": false,
"skipLibCheck": true,
"esModuleInterop": false,
"allowSyntheticDefaultImports": true,
// 严格模式
"strict": true,
"forceConsistentCasingInFileNames": true,
"module": "ESNext",
"moduleResolution": "Node",
"resolveJsonModule": true,
"isolatedModules": true,
"noEmit": true,
"jsx": "react-jsx",
"baseUrl": "./",
// src 跟路径映射
"paths": {
"@/*": ["src/*"]
}
},
// 检查文件
"include": ["src/**/*.ts", "src/**/*.tsx"],
// 排除文件
"exclude": ["node_modules"],
"references": [{ "path": "./tsconfig.node.json" }]
}
可以参考 这里
可以参考 这里