有的时候项目需要部署在服务器的子目录下,这时就要根据开发环境或生产环境动态配置 vite.config.ts
中的 base
选项。
查看vscode的TS类型提示:
可以发现:defineConfig接收一个UserConfig对象,或者一个返回UserConfig对象的函数,这个函数接收一个ConfigEnv对象作为参数,ConfigEnv的类型声明如下:
command
属性一共有两个值 build
和 serve
,对应了 package.json
定义的脚本名称,分别为构建生产版本和开启开发服务。可以通过解构并判断 command
的值,来动态给base赋值,代码如下:
export default defineConfig(({ command }) => {
// 根据command动态配置base
let base: string
if (command === 'build') {
base = '/jxxt/'
} else {
base = '/'
}
// 返回 UserConfig
return {
base,
...{ otherOptions },
}
})
这个时候就可以根据我们的命令动态配置 base
了。
PS: 也可以根据 ConfigEnv
中的 mode
属性来判断,但是这个属性没有类型约束,需要确定拼写正确。