c语言编程笔录

首页 >   > 笔记大全

笔记大全

深入探讨vite是如何解析 env文件的

更新时间:2023-09-30

一、vite是什么

Vite是一个基于浏览器原生 ES 模块导入的开发服务器。通过利用浏览器去解析模块化 JavaScript 代码,尽可能的提前执行代码,使得应用启动更快。

二、vite如何解析.env文件

Vite 开发过程中,可以借助 .env 文件设置环境变量,通过process.env来访问。vite 支持使用三个不同名字的 .env 文件和 node.js 的 api 方法来区分不同的环境。 1. .env:默认被所有环境所读取 2. .env.development:只在 development 环境被读取 3. .env.production:只在 production 环境被读取 可以使用以下命令来传入不同的环境变量:

		vite serve --mode development //传入 development 的环境变量
		vite build --mode production //传入 production 的环境变量
	

三、示例代码

例如在 .env.development 中设置了以下的环境变量:

		VITE_APP_TITLE=Hello Vite
	

在应用中可以通过 `process.env.VITE_APP_TITLE` 访问到环境变量。下面是示例代码:

		console.log(process.env.VITE_APP_TITLE)
	

四、环境变量类型

vite 支持设置不同类型的环境变量:boolean、string、number等等。下面是示例代码:

		//.env文件里
		VITE_APP_DEBUG=true
		VITE_APP_PORT=8080
		VITE_APP_VERSION=1.0
	
		//some-file.js文件里
		console.log(process.env.VITE_APP_DEBUG==='true')
		console.log(process.env.VITE_APP_PORT===8080)
		console.log(process.env.VITE_APP_VERSION==='1.0')
	

process.env 可以在任何位置访问,不必使用全局变量