Node.js 环境变量动态获取和静态获取的区别

Node.js 环境变量动态获取和静态获取的区别

Node.js 环境 vs 浏览器环境
  • process.env.SERVICE_PORTAL:

    • 适用环境:Node.js 环境。
    • 用途:访问操作系统的环境变量。
  • import.meta.env.SERVICE_PORTAL:

    • 适用环境:浏览器环境,特别是在使用 Vite 等现代构建工具时。
    • 用途:从构建过程中注入环境变量到浏览器环境中。
构建时注入
  • process.env.SERVICE_PORTAL:

    • 设置方式:环境变量是在运行 Node.js 应用程序之前设置的,通常通过命令行参数或环境配置文件。
    • 动态性:环境变量在运行时动态获取,不能在运行时修改。
  • import.meta.env.SERVICE_PORTAL:

    • 设置方式 :环境变量是在构建过程中从环境文件(如 .env 文件)中注入的。
    • 静态性:在应用程序构建时被静态地注入到代码中,不能在运行时修改。
可静态提取 vs 不可静态提取
  • process.env.SERVICE_PORTAL:

    • 静态性:存储的值是在运行时动态获取的,无法在构建时进行静态分析或提取。
  • import.meta.env.SERVICE_PORTAL:

    • 静态性 :一些构建工具能够静态提取 import.meta.env 中的值,使得它们可以在构建时进行优化或者提取出来。这些值可以在构建期间进行优化和变换。

总结

在 Node.js 环境中,使用 process.env 可以访问操作系统的环境变量,而在浏览器环境中,特别是使用 Vite 等现代构建工具时,可以使用 import.meta.env 来从构建过程中注入环境变量。两者在设置方式、动态性和静态性上都有所不同,需要根据具体环境和需求选择合适的方式来使用环境变量。

相关推荐
理想不理想v1 小时前
vue种ref跟reactive的区别?
前端·javascript·vue.js·webpack·前端框架·node.js·ecmascript
暮毅5 小时前
10.Node.js连接MongoDb
数据库·mongodb·node.js
~甲壳虫11 小时前
说说webpack中常见的Plugin?解决了什么问题?
前端·webpack·node.js
~甲壳虫11 小时前
说说webpack中常见的Loader?解决了什么问题?
前端·webpack·node.js
~甲壳虫11 小时前
说说webpack proxy工作原理?为什么能解决跨域
前端·webpack·node.js
熊的猫12 小时前
JS 中的类型 & 类型判断 & 类型转换
前端·javascript·vue.js·chrome·react.js·前端框架·node.js
前端青山1 天前
Node.js-增强 API 安全性和性能优化
开发语言·前端·javascript·性能优化·前端框架·node.js
GDAL1 天前
npm入门教程1:npm简介
前端·npm·node.js
郑小憨1 天前
Node.js简介以及安装部署 (基础介绍 一)
java·javascript·node.js
lin-lins1 天前
模块化开发 & webpack
前端·webpack·node.js