优秀的编程知识分享平台

网站首页 > 技术文章 正文

Node.js中的process.env是个什么玩意儿如何在Vue中的使用

nanyue 2024-08-18 19:53:20 技术文章 15 ℃

Process.env在nodejs中的使用

process.env是Node.js中的环境变量,先看下官方解释:

process 对象是一个 global (全局变量),提供有关信息,控制当前 Node.js 进程。

作为一个对象,它对于 Node.js 应用程序始终是可用的,故无需使用 require()。

process(进程)其实就是存在nodejs中的一个全局变量,所有模块都可以调用。

既然是全局变量,那就好办了,node应用,程序是始终可用的,无需require()拿来做环境配置岂不是很合适?

所以你会经常看到下面的用法:

if (process.env.NODE_ENV === 'production') {
module.exports = require('./prod.js')//正式环境代码
} else {
module.exports = require('./dev.js')//测试环境代码
}

以上代码中出现一个.NODE_ENV 这又是什么呢?

你可以console.log一下process.env 你会发现其实 .NODE_ENV这个属性是不存在滴,NODE_ENV是一个开发者自己定义的变量。经常被用来做判断生产环境和开发环境的依据。

所以你可能见到过这样的用法:

 "scripts": {
 "dev": "cross-env NODE_ENV=development nodemon server/index.js --watch server",
 "build": "nuxt build",
 "start": "cross-env NODE_ENV=production node server/index.js",
 "generate": "nuxt generate",
 "test": "jest"
 },

顺便说一下cross-env是运行跨平台设置和使用环境变量的脚本。

我们也可以根据环境变量导出对应的参数配置,比如做类似操作:

var dev = {};
var build = {};
module.exports = process.env.NODE_ENV === ’dev' ? dev : build;

最后看下process.env在Vue项目中的使用

在使用Vue Cli构建的项目中,

需要将process.env 设置其他变量名进行使用,如:BUILD_ENV

在 package.json 的 script 字段中作如下配置:

"scripts": {
 "start": "cross-env BUILD_ENV=dev node build/dev-server.js",
 "dev": "cross-env BUILD_ENV=dev node build/dev-server.js",
 "build": "cross-env BUILD_ENV=dev node build/build.js",
 "buildDev": "cross-env BUILD_ENV=dev node build/build.js",
 "buildStag": "cross-env BUILD_ENV=stag node build/build.js",
 "buildProd": "cross-env BUILD_ENV=prod node build/build.js",
 "unit": "cross-env BABEL_ENV=test karma start test/unit/karma.conf.js --single-run",
 "e2e": "node test/e2e/runner.js",
 "test": "npm run unit && npm run e2e",
 "lint": "eslint --ext .js,.vue src test/unit/specs test/e2e/specs"
 },

由于搭配webpack重新设置了 process.env 的值,需要在

webpack.dev.conf.js 文件中:

webpack.dev.conf.js
new webpack.DefinePlugin({
 'process.env': config.dev.env,
 'process.env.BUILD_ENV': JSON.stringify(process.env.BUILD_ENV)//增加此行
})

webpack.prod.conf.js 文件中:

webpack.prod.conf.js
new webpack.DefinePlugin({
 'process.env': env,
 'process.env.BUILD_ENV': JSON.stringify(process.env.BUILD_ENV)
})

即在该插件设置并暴露出 process.env 对象后,再增加

process.env.BUILD_ENV 字段并进行赋值。

最近发表
标签列表