Vite(六)配置 Vite
- 网址:https://vitejs.cn/guide/why.html
1. 配置 Vite
#配置文件
#配置文件解析
当以命令行方式运行 vite
时,Vite 会自动解析 项目根目录 下名为 vite.config.js
的文件。
最基础的配置文件是这样的:
// vite.config.js
export default {
// 配置选项
}
注意,即使项目没有在 package.json
中开启 type: "module"
,Vite 也支持在配置文件中使用 ESM 语法。在这种情况下,配置文件是在加载之前自动预处理的。
你可以显式地通过 --config
命令行选项指定一个配置文件(解析会相对于 cwd
路径)
vite --config my-config.js
#配置智能提示
因为 Vite 本身附带 Typescript 类型,所以你可以通过 IDE 和 jsdoc 的配合来进行智能提示:
/**
* @type {import('vite').UserConfig}
*/
const config = {
// ...
}
export default config
另外你可以使用 defineConfig
帮手函数,这样不用 jsdoc 注解也可以获取类型提示:
import {
defineConfig } from 'vite'
export default defineConfig({
// ...
})
Vite 也直接支持 TS 配置文件。你可以在 vite.config.ts
中使用 defineConfig
帮手函数。
#情景配置
如果配置文件需要基于命令(serve
或 build
)或者不同场景与 模式 来决定选项,可以选择导出这样一个函数:
export default ({
command, mode }) => {
if (command === 'serve') {
return {
// serve 独有配置
}
} else {
return {
// build 独有配置
}
}
}
#共享配置
#root
-
类型:
string
-
默认:
process.cwd()
项目根目录(
index.html
文件所在的位置)。可以是一个绝对路径,或者一个相对于该配置文件本身的路径。更多细节请见 项目根目录。
#base
-
类型:
string
-
默认:
/
开发或生产环境服务的 公共基础路径。合法的值包括以下几种:
- 绝对 URL 路径名,例如
/foo/
- 完整的 URL,例如
https://foo.com/
- 空字符串或
./
(用于开发环境)
更多信息详见 公共基础路径。
- 绝对 URL 路径名,例如
#mode
-
类型:
string
-
默认: serve 时默认
'development'
,build 时默认'production'
在配置中指明将会把 serve 和 build 时的模式 都 覆盖掉。也可以通过命令行
--mode
选项来重写。查看 环境变量与模式 章节获取更多细节。
#define
-
类型:
Record<string, string>
定义全局变量替换方式。每项在开发时会被定义为全局变量,而在构建时则是静态替换。
- 从
2.0.0-beta.70
版本开始,字符串值将作为一个直接的表达式,所以如果定义为了一个字符串常量,它需要被显式地引用(例如:通过JSON.stringify
)。 - 替换只会在匹配到周围是单词边界(
\b
)时执行。
- 从
#plugins
-
类型:
(Plugin | Plugin[])[]
将要用到的插件数组。查看 插件 API 获取 Vite 插件的更多细节。
#publicDir
-
类型:
string
-
默认:
"public"
作为静态资源服务的文件夹。这个目录中的文件会再开发中被服务于
/
,在构建时,会被拷贝到outDir
根目录,并没有转换,永远只是复制到这里。该值可以是文件系统的绝对路径,也可以是相对于项目根的路径。
#resolve.alias
-
类型:
Record<string, string> | Array<{ find: string | RegExp, replacement: string }>
将会被传递到
@rollup/plugin-alias
作为它的 entries。也可以是一个对象,或一个{ find, replacement }
的数组.当使用文件系统路径的别名时,请始终使用绝对路径。相对路径作别名值将按原样使用导致不会解析到文件系统路径中。
更高级的自定义解析方法可以通过 插件 实现。
#resolve.dedupe
-
类型:
string[]
如果你在你的应用程序中有相同依赖的副本(比如 monorepos),使用这个选项来强制 Vite 总是将列出的依赖关系解析到相同的副本&#