在node中，有全局变量process表示的是当前的node进程。process.env包含着关于系统环境的信息。但是process.env中并不存在NODE_ENV这个东西。NODE_ENV是用户一个自定义的变量，在webpack中它的用途是判断生产环境或开发环境的依据的。
为了查看 process的基本信息，我们可以在文件夹中 新建一个 process.js 文件，在里面加一句代码：console.log(process);然后进入该文件夹，执行 node process.js 可以在命令行中打印如下信息：
$ node process.js
process {
title: 'node',
version: 'v4.4.4',
moduleLoadList:
[....],
versions:
{ http_parser: '2.5.2',
node: '4.4.4',
v8: '4.5.103.35',
uv: '1.8.0',
zlib: '1.2.8',
ares: '1.10.1-DEV',
icu: '56.1',
modules: '46',
openssl: '1.0.2h' },
arch: 'x64',
platform: 'darwin',
release:
{ name: 'node',
lts: 'Argon',
sourceUrl: 'https://nodejs.org/download/release/v4.4.4/node-v4.4.4.tar.gz',
headersUrl: 'https://nodejs.org/download/release/v4.4.4/node-v4.4.4-headers.tar.gz' },
argv:
[ '/Users/tugenhua/.nvm/versions/node/v4.4.4/bin/node',
'/Users/tugenhua/个人demo/process.js' ],
execArgv: [],
env:
{ TERM_PROGRAM: 'Apple_Terminal',
SHELL: '/bin/zsh',
TERM: 'xterm-256color',
TMPDIR: '/var/folders/l7/zndlx1qs05v29pjhvkgpmhjm0000gn/T/',
Apple_PubSub_Socket_Render: '/private/tmp/com.apple.launchd.7Ax4C1EWMx/Render',
TERM_PROGRAM_VERSION: '404',
TERM_SESSION_ID: '82E05668-442D-4180-ADA3-8CF64D85E5A9',
USER: 'tugenhua',
SSH_AUTH_SOCK: '/private/tmp/com.apple.launchd.MYOMheYcL3/Listeners',
PATH: '/Users/tugenhua/.nvm/versions/node/v4.4.4/bin:/usr/local/bin:/usr/bin:/bin:/usr/sbin:/sbin',
PWD: '/Users/tugenhua/个人demo',
LANG: 'zh_CN.UTF-8',
XPC_FLAGS: '0x0',
XPC_SERVICE_NAME: '0',
SHLVL: '1',
HOME: '/Users/tugenhua',
LOGNAME: 'tugenhua',
SECURITYSESSIONID: '186a8',
OLDPWD: '/Users/tugenhua/工作文档/sns_pc',
ZSH: '/Users/tugenhua/.oh-my-zsh',
PAGER: 'less',
LESS: '-R',
LC_CTYPE: 'zh_CN.UTF-8',
LSCOLORS: 'Gxfxcxdxbxegedabagacad',
NVM_DIR: '/Users/tugenhua/.nvm',
NVM_NODEJS_ORG_MIRROR: 'https://nodejs.org/dist',
NVM_IOJS_ORG_MIRROR: 'https://iojs.org/dist',
NVM_RC_VERSION: '',
MANPATH: '/Users/tugenhua/.nvm/versions/node/v4.4.4/share/man:/usr/local/share/man:/usr/share/man:/Applications/Xcode.app/Contents/Developer/Platforms/MacOSX.platform/Developer/SDKs/MacOSX10.13.sdk/usr/share/man:/Applications/Xcode.app/Contents/Developer/usr/share/man:/Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/share/man',
NVM_PATH: '/Users/tugenhua/.nvm/versions/node/v4.4.4/lib/node',
NVM_BIN: '/Users/tugenhua/.nvm/versions/node/v4.4.4/bin',
_: '/Users/tugenhua/.nvm/versions/node/v4.4.4/bin/node',
__CF_USER_TEXT_ENCODING: '0x1F5:0x19:0x34' },
pid: 14034,
features:
{ debug: false,
uv: true,
ipv6: true,
tls_npn: true,
tls_sni: true,
tls_ocsp: true,
tls: true },
_needImmediateCallback: false,
config: {},
nextTick: [Function: nextTick],
_tickCallback: [Function: _tickCallback],
_tickDomainCallback: [Function: _tickDomainCallback],
stdout: [Getter],
stderr: [Getter],
stdin: [Getter],
openStdin: [Function],
exit: [Function],
kill: [Function],
mainModule:
Module {
id: '.',
exports: {},
parent: null,
filename: '/Users/tugenhua/个人demo/process.js',
loaded: false,
children: [],
paths:
[ '/Users/tugenhua/个人demo/node_modules',
'/Users/tugenhua/node_modules',
'/Users/node_modules',
'/node_modules' ] } }
如上就可以看到 process是node的全局变量，并且process有env这个属性，但是没有NODE_ENV这个属性。
process.env 属性返回的是一个包含用户环境信息的对象，它可以区分开发环境或正式环境的依据，那么我们如何配置环境变量呢？
一. 如何配置环境变量：
直接在cmd环境配置即可，查看环境变量，添加环境变量，删除环境变量等操作。
1.1 windows环境配置如下：
#node中常用的到的环境变量是NODE_ENV，首先查看是否存在 set NODE_ENV #如果不存在则添加环境变量 set NODE_ENV=production #环境变量追加值 set 变量名=%变量名%;变量内容 set path=%path%;C:\web;C:\Tools #某些时候需要删除环境变量 set NODE_ENV=
1.2 Linux配置(mac系统环境也属于这个)
#node中常用的到的环境变量是NODE_ENV，首先查看是否存在 echo $NODE_ENV #如果不存在则添加环境变量 export NODE_ENV=production #环境变量追加值 export path=$path:/home/download:/usr/local/ #某些时候需要删除环境变量 unset NODE_ENV #某些时候需要显示所有的环境变量 env
如下查看环境变量，添加环境变量，删除环境变量操作如下：
显示所有的环境变量，如下图所示
注意：如果我们在命令行中设置环境变量后，比如设置 production 后，如下设置：
export NODE_ENV=production ，那么会在所有的项目下都是正式环境，当我们使用命令 npm install 后下载依赖包时，只会把 package.json中的dependencies依赖项下载下来，对于devDependencies中的依赖包是下载不下来的。
因此我们需要使用上面的命令 unset NODE_ENV 删除刚刚设置的环境变量。
二：理解 DefinePlugin 含义
官网（https://webpack.js.org/plugins/define-plugin/）
官网解释的是：DefinePlugin允许我们创建全局变量，可以在编译时进行设置，因此我们可以使用该属性来设置全局变量来区分开发环境和正式环境。这就是 DefinePlugin的基本功能。
因此我们可以在webpack.config.js 中添加如下代码配置全局变量信息了，因为当webpack进行编译的时候会全局设置变量；如下代码：
module.exports = {
plugins: [
// 设置环境变量信息
new webpack.DefinePlugin({
PRODUCTION: JSON.stringify(true),
VERSION: JSON.stringify('5fa3b9'),
BROWSER_SUPPORTS_HTML5: true,
TWO: '1+1',
'typeof window': JSON.stringify('object'),
'process.env': {
NODE_ENV: JSON.stringify(process.env.NODE_ENV)
}
})
]
}
package.json 打包配置如下命令：
"scripts": {
"dev": "webpack-dev-server --progress --colors --devtool cheap-module-eval-source-map --hot --inline",
"build": "webpack --progress --colors --devtool cheap-module-source-map",
"build:dll": "webpack --config webpack.dll.config.js"
},
这样配置完成后，为了验证一下是否是全局变量，运行npm run dev 打包后，我们可以在我们项目中入口js文件，打印下即可：比如如下代码：
console.log('Running App version ' + VERSION); // 打印 Running App version 5fa3b9
console.log(PRODUCTION); // 打印 true
console.log(process.env); // 打印 { NODE_ENV: undefined }
如上信息可以看到 process.env.NODE_ENV 打印出为undefined，那是因为我们在 package.json文件中未进行配置。下面我们把package.json 加上 NODE_ENV变量值，代码打包命令变成如下：
"scripts": {
"dev": "NODE_ENV=development webpack-dev-server --progress --colors --devtool cheap-module-eval-source-map --hot --inline",
"build": "NODE_ENV=production webpack --progress --colors --devtool cheap-module-source-map",
"build:dll": "webpack --config webpack.dll.config.js"
},
如上打包命令，在dev打包命令上，前面加上了 NODE_ENV=development 命令，在build打包命令上前面加上了 NODE_ENV=production，因此继续查看代码结果变为如下：
console.log('Running App version ' + VERSION); // 打印 Running App version 5fa3b9
console.log(PRODUCTION); // 打印 true
console.log(process.env); // 打印 { NODE_ENV: 'development' }
可以看到这个时候 process.env.NODE_ENV 才有值，因此在项目打包中，为了区分开发环境和正式环境我们像如上配置即可，然后在webpack.config.js中通过 process.env.NODE_ENV 这个来区分正式环境还是开发环境即可。
三：理解 cross-env
1. 什么是cross-env呢？
它是运行跨平台设置和使用环境变量的脚本。
2. 它的作用是啥？
当我们使用 NODE_ENV = production 来设置环境变量的时候，大多数windows命令会提示将会阻塞或者异常，或者，windows不支持NODE_ENV=development的这样的设置方式，会报错。因此 cross-env 出现了。我们就可以使用 cross-env命令，这样我们就不必担心平台设置或使用环境变量了。也就是说 cross-env 能够提供一个设置环境变量的scripts，这样我们就能够以unix方式设置环境变量，然而在windows上也能够兼容的。
要使用该命令的话，我们首先需要在我们的项目中进行安装该命令，安装方式如下：
npm install --save-dev cross-env
然后在package.json中的scripts命令如下如下：
"scripts": {
"dev": "cross-env NODE_ENV=development webpack-dev-server --progress --colors --devtool cheap-module-eval-source-map --hot --inline",
"build": "cross-env NODE_ENV=production webpack --progress --colors --devtool cheap-module-source-map",
"build:dll": "webpack --config webpack.dll.config.js"
}
以上就是深入理解webpack process.env.NODE_ENV配置的详细内容，更多关于webpack process.env.NODE_ENV配置的资料请关注其它相关文章！
免责声明：本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除！
《魔兽世界》大逃杀！60人新游玩模式《强袭风暴》3月21日上线
暴雪近日发布了《魔兽世界》10.2.6 更新内容，新游玩模式《强袭风暴》即将于3月21 日在亚服上线，届时玩家将前往阿拉希高地展开一场 60 人大逃杀对战。
艾泽拉斯的冒险者已经征服了艾泽拉斯的大地及遥远的彼岸。他们在对抗世界上最致命的敌人时展现出过人的手腕，并且成功阻止终结宇宙等级的威胁。当他们在为即将于《魔兽世界》资料片《地心之战》中来袭的萨拉塔斯势力做战斗准备时，他们还需要在熟悉的阿拉希高地面对一个全新的敌人──那就是彼此。在《巨龙崛起》10.2.6 更新的《强袭风暴》中，玩家将会进入一个全新的海盗主题大逃杀式限时活动，其中包含极高的风险和史诗级的奖励。
《强袭风暴》不是普通的战场，作为一个独立于主游戏之外的活动，玩家可以用大逃杀的风格来体验《魔兽世界》，不分职业、不分装备（除了你在赛局中捡到的），光是技巧和战略的强弱之分就能决定出谁才是能坚持到最后的赢家。本次活动将会开放单人和双人模式，玩家在加入海盗主题的预赛大厅区域前，可以从强袭风暴角色画面新增好友。游玩游戏将可以累计名望轨迹，《巨龙崛起》和《魔兽世界：巫妖王之怒 经典版》的玩家都可以获得奖励。
更新日志
- 凤飞飞《我们的主题曲》飞跃制作[正版原抓WAV+CUE]
- 刘嘉亮《亮情歌2》[WAV+CUE][1G]
- 红馆40·谭咏麟《歌者恋歌浓情30年演唱会》3CD[低速原抓WAV+CUE][1.8G]
- 刘纬武《睡眠宝宝竖琴童谣 吉卜力工作室 白噪音安抚》[320K/MP3][193.25MB]
- 【轻音乐】曼托凡尼乐团《精选辑》2CD.1998[FLAC+CUE整轨]
- 邝美云《心中有爱》1989年香港DMIJP版1MTO东芝首版[WAV+CUE]
- 群星《情叹-发烧女声DSD》天籁女声发烧碟[WAV+CUE]
- 刘纬武《睡眠宝宝竖琴童谣 吉卜力工作室 白噪音安抚》[FLAC/分轨][748.03MB]
- 理想混蛋《Origin Sessions》[320K/MP3][37.47MB]
- 公馆青少年《我其实一点都不酷》[320K/MP3][78.78MB]
- 群星《情叹-发烧男声DSD》最值得珍藏的完美男声[WAV+CUE]
- 群星《国韵飘香·贵妃醉酒HQCD黑胶王》2CD[WAV]
- 卫兰《DAUGHTER》【低速原抓WAV+CUE】
- 公馆青少年《我其实一点都不酷》[FLAC/分轨][398.22MB]
- ZWEI《迟暮的花 (Explicit)》[320K/MP3][57.16MB]