vite 环境变量

环境变量的作用

一个项目可能会有开发版本、上线版本、测试版本等等多个版本，不同的环境会有不同请求api接口，就需更改一些基本配置，基本路径，服务器代理这种都要更改一遍，这时候就显得很麻烦，所以就需要使用到环境变量

vite中的环境变量

vite无法直接读取到env文件，需要loadEnv方法主动读取。

将vite.config文件更改为函数模式，通过mode来判断当前环境.
loadEnv 会自动检测文件夹下的 <code>.env.development.local` `.env.development` `.env.production.local` `.env.production` `.env` `.env.local 文件

需要注意的是，变量的名称必须以VITE为开头，否则不会识别

vite.config.js文件 使用loadEnv加载环境变量

export default ({command, mode}) => {
    const envConfig = loadEnv(mode, './');
    let config = {}
    return defineConfig(config)
}

.env文件 变量名称必须以VITE开头

VITE_APP_API=http://localhost:8081
VITE_APP_Base=/

使用变量

import.meta.env.VITE_APP_API