前端小白之process.env.PORT

本文详细介绍了如何在Node.js应用中设置和使用环境变量,特别是process.env.PORT,用于指定服务端口。通过DOS命令行,可以创建、查看和删除环境变量,实现在不同环境中灵活调整端口配置。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

为了满足正式环境中的node服务的端口启动需求,有时候需要用到port环境变量,那么这时候就需要在node启动时,设置process.env.PORT。

process.env.PORT:读取当前目录下环境变量port的值

win下可通过 set/? 查看环境变量的新增方式与查看方式

设置node的 process.env.PORT 变量 示例代码: app.set('port', process.env.PORT || 8080);

1.  创建 环境变量port 

DOS命令下,切换到当前项目目录:
`set port=3000`  //设置process.env.PORT为3000
`node app.js`    //监听3000端口

// 环境变量port不区分大小写,port PORT Port 效果相同
当然了,本次设置的port环境变量只对当前目录有效。
复制代码
  1. 删除 环境变量port
`set port=`     //删除port环境变量
`node app.js`     //监听系统文件中设置的端口,也就是8080。

3. 查看 环境变量port (两种方式)
(1)在dos命令输入` node` ,然后在node命令下输入 `process.env.PORT` 查看
(2)在dos命令中输入 `set port` 查看
复制代码
### 关于前端项目中 `process.env` 和 `process.env.NODE_ENV` 值不一致的原因及解决方案 在前端项目中,`process.env` 是一个全局对象,用于存储环境变量。其中,`process.env.NODE_ENV` 是一个特殊的环境变量,通常用于指示当前运行的环境(如开发环境、测试环境或生产环境)。然而,在某些情况下,可能会出现 `process.env` 和 `process.env.NODE_ENV` 的值不一致的问题[^1]。 #### 1. **原因分析** ##### (1) 环境变量未正确设置 如果项目的构建工具(如 Webpack、Vite 等)没有正确地将环境变量注入到代码中,可能导致 `process.env.NODE_ENV` 的值与预期不符。例如,在使用 Webpack 的 DefinePlugin 插件时,如果没有正确配置 `NODE_ENV`,则会导致注入的值错误[^3]。 ##### (2) 多个环境文件冲突 当项目中存在多个 `.env` 文件(如 `.env.development` 和 `.env.production`),并且这些文件中的变量定义不一致时,可能会导致环境变量加载混乱。例如,`.env.local` 文件优先级高于其他环境文件,如果 `.env.local` 中定义了与 `.env.development` 不同的 `NODE_ENV` 值,则会导致冲突[^2]。 ##### (3) 构建工具配置问题 某些构建工具(如 Vite 或 Create React App)会自动从 `.env` 文件中读取变量并注入到 `import.meta.env` 或 `process.env` 中。如果配置不当,可能会导致环境变量注入失败或注入错误的值。例如,在 Vite 中,只有以 `VITE_` 开头的变量才会被注入到 `import.meta.env` 中[^1]。 ##### (4) 跨平台兼容性问题 在 Windows 系统中,直接通过命令行设置环境变量(如 `NODE_ENV=development`)可能会导致异常或阻塞。为了解决这一问题,可以使用 `cross-env` 工具来确保跨平台兼容性。 #### 2. **解决方案** ##### (1) 检查环境变量设置 确保在项目启动时正确设置了 `NODE_ENV` 环境变量。可以通过以下方式检查: ```javascript console.log(process.env.NODE_ENV); ``` 如果发现值不正确,可以尝试通过命令行手动设置环境变量,或者使用 `cross-env` 工具来解决跨平台兼容性问题[^3]。 ##### (2) 确保环境文件优先级正确 检查项目的 `.env` 文件优先级,确保 `.env.local` 文件不会覆盖其他环境文件中的重要变量。例如,在 Vue 或 Vite 项目中,`.env.local` 的优先级最高,因此需要谨慎定义变量[^2]。 ##### (3) 配置构建工具 根据使用的构建工具,正确配置环境变量注入逻辑。例如,在 Webpack 中可以使用 DefinePlugin 插件来注入环境变量: ```javascript new webpack.DefinePlugin({ 'process.env.NODE_ENV': JSON.stringify('production') }); ``` 在 Vite 中,确保环境变量以 `VITE_` 开头,并通过 `import.meta.env` 访问: ```javascript console.log(import.meta.env.VITE_API_URL); ``` ##### (4) 使用 `dotenv` 加载环境变量 如果项目中未使用 `.env` 文件,可以通过安装 `dotenv` 包来加载环境变量: ```bash npm install dotenv --save-dev ``` 然后在入口文件中引入并加载: ```javascript require('dotenv').config(); console.log(process.env.NODE_ENV); ``` #### 3. **代码示例** 以下是一个使用 `cross-env` 设置环境变量的示例: ```bash # 安装 cross-env npm install cross-env --save-dev # 在 package.json 中配置启动脚本 "scripts": { "start": "cross-env NODE_ENV=development node server.js", "build": "cross-env NODE_ENV=production webpack" } ``` 以下是 Vite 项目中使用 `import.meta.env` 的示例: ```javascript // .env.development VITE_APP_TITLE="Dev Title" // .env.production VITE_APP_TITLE="Prod Title" // main.js console.log(import.meta.env.VITE_APP_TITLE); // 根据环境输出不同的值 ``` --- ###
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值