vite获取所有环境变量(env)的实现方法
作者：一拖再拖 一拖再拖
本文主要介绍了vite获取所有环境变量(env)的实现方法,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
0.环境变量文件
API_URL=8888888 VITE_API_URL=9999999
1.定义环境变量
默认情况下，vite只获取以VITE_为前缀的环境变量。
为了防止意外地将一些环境变量泄漏到客户端，只有以 VITE_ 为前缀的变量才会暴露给经过 vite 处理的代码
但如果你觉得你是进击的巨人，可以参考如下方案直接获取所有环境变量。
import { defineConfig, loadEnv } from 'vite'
export default defineConfig(({ mode }) => {
const env = loadEnv(mode, process.cwd(), '')
// 如果你用的ts，请使用 let define: { [key: string]: string } = {};
let define = {};
Object.keys(env).forEach(key => {
define[`import.meta.env.${key}`] = JSON.stringify(env[key])
})
return {
//.....
define: {
...define
}
}
})
- mode：测试环境/正式环境/自定义环境
- process.cwd()：当前项目根目录
- “” ：加载所有环境变量
同理，既然可以暴露全部，你也可以拆分部分环境变量暴露：
define: {
"import.meta.env.API_URL":define["import.meta.env.API_URL"]
}
2.读取环境变量
vite客户端获取变量的方法和其他构建工具有一定差异，使用 import.meta.env.XX获取。
console.log(import.meta.env)
到此这篇关于vite获取所有环境变量(env)的实现方法的文章就介绍到这了,更多相关vite获取所有环境变量 内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！