主题
共享配置
base
- 类型:
string
- 默认:
/
开发或生产环境服务的公共基础路径。合法的值包括以下几种:
- 绝对 URL 路径名,例如
/foo/
- 完整的 URL,例如
https://bar.com/foo/
(域名部分在开发环境中不会被使用,因此该值与/foo/
相同) - 空字符串或
./
(用于嵌入形式的开发)
define
定义全局常量替换方式。其中每项在开发环境下会被定义在全局,而在构建时被静态替换。
js
export default defineConfig({
define: {
__APP_VERSION__: JSON.stringify('v1.0.0'),
__API_URL__: 'window.__backend_api_url',
},
})
提示
对于使用 TypeScript 的开发者来说,请确保在 env.d.ts
或 vite-env.d.ts
文件中添加类型声明,以获得类型检查以及代码提示:
ts
// vite-env.d.ts
declare const __APP_VERSION__: string
publicDir
- 类型:
string
|false
- 默认:
"public"
作为静态资源服务的文件夹。
plugins
需要用到的插件数组。该目录中的文件在开发期间在 /
处提供,并在构建期间复制到 build.outDir
的根目录,并且始终按原样提供或复制而无需进行转换。
Falsy 虚值的插件将被忽略,插件数组将被扁平化(flatten)。
resolve
resolve.alias
传递到 @rollup/plugin-alias
的 entries 选项。
js
import { fileURLToPath, URL } from 'node:url'
import { defineConfig } from 'vite'
export default defineConfig({
resolve: {
alias: {
'@': fileURLToPath(new URL('./src', import.meta.url)),
'utils': fileURLToPath(new URL('./src/utils', import.meta.url)),
},
},
})
js
import { fileURLToPath, URL } from 'node:url'
import { defineConfig } from 'vite'
export default defineConfig({
resolve: {
alias: [
{ find: '@', replacement: fileURLToPath(new URL('./src', import.meta.url)) },
{ find: 'utils', replacement: fileURLToPath(new URL('./src/utils', import.meta.url)) },
],
},
})
注意
避免使用 ~
作为别名,特别是在路径解析相关的场景中。
css
preprocessorOptions
指定传递给 CSS 预处理器的选项。
sass 配置
- 选择要使用的 sass 应用程序接口
api: "modern-compiler" | "modern" | "legacy"
(如果安装了sass-embedded
,默认为 "modern-compiler",否则为 "modern"). 为获得最佳性能,建议使用api: "modern-compiler"
和sass-embedded
软件包。 - "legacy" API 已过时,将在 Vite 7 中移除。
js
export default defineConfig({
// ...
scss: {
// 若安装了 sass-embedded(推荐),默认是 "modern-compiler"
api: 'modern-compiler', // "modern" | "modern-compiler" | "legacy"
},
})
详细说明
bash
npm i -D sass sass-embedded
less 配置
js
export default defineConfig({
// ...
css: {
preprocessorOptions: {
less: {
math: 'always', // 强制允许计算表达式
javascriptEnabled: true, // 允许在 Less 中执行 JavaScript 表达式
},
},
},
})
lightningcss
该选项用于配置 Lightning CSS。