背景

  webpack有一特性就是可以让使用者灵活的在不同环境(开发环境,生产环境等)进行相应的特性的策略打包,比如: 是否使用反向代理使用接口,针对不同的静态资源(如图片等)是直接拷贝还是进行打包编译等等,这一特性的诞生归功于Nodejs的环境变量-process.env. NODE_ENV

process.env. NODE_ENV

  1. 值

    1.1  production:生产阶段

    1.2 development/staging: 开发阶段

  2. webpack中的应用

// webpack.config.js
module.exports = {
  // webpack的mode(模式参数):不同模式下进行不同的内置优化
  mode: process.env.NODE_ENV === 'production' ? 'production' : 'development'
}
  3. 使用
    3.1 这个变量在具体的应用的时候是需要对当前的环境变量进行设置的,一般情况会在进行执行不同命令的时候去设置
    3.2 由于这个变量针对于不同的系统设置方式不一样,如设置为开发模式的话,
window系统: set NODE_ENV=development
mac系统: export NODE_ENV=development
    3.3 鉴于兼容性和使用上的问题,就有人开发了cross-env
       3.3.1 这是一个跨平台的第三方的包,使用的时候需要安装下,npm i --save-dev cross-env
       3.3.2 设置环境变量: cross-env NODE_ENV=development即可
// package.json
{
  "scripts": {
    // 设置为开发环境并且按照webpack.dev.js的配置进行打包部署
    "dev": "cross-env NODE_ENV=development webpack --config webpack.config.js"
   }
}
      上述只是讲解了一个大概的思路和对应的小例子,请大家根据自己具体的项目进行特殊配置。
 
       如有不严谨和错误地方请希望指正,祝大家工作顺利 ! 

webpack配置中环境变量-process.env. NODE_ENV的更多相关文章

  1. Node.js中环境变量process.env详解

    Node.js中环境变量process.env详解process | Node.js API 文档http://nodejs.cn/api/process.html官方解释:process 对象是一个 ...

  2. Node 环境变量 process.env.NODE_ENV 之webpack应用

    转载来源:https://github.com/wfzong/NODE_ENV_TEST,这里还有源码可以学习,谢谢原作者的分享! 对于process.env.NODE_ENV困惑起因为在配置webp ...

  3. Node环境变量 process.env 的那些事儿

    前言 这两天在和运维GG搞部署项目的事儿. 碰到一个问题就是,咱们的dev,uat,product环境的问题. 因为是前后端分离,所以在开发和部署的过程中会有对后端接口的域名的切换问题.折腾了一下午, ...

  4. node与webpack的process.env.NODE_ENV

    先看两篇文章 1.前端工程项目的NODE_ENV 2. Node 环境变量 process.env.NODE_ENV 之webpack应用 3.process.env.NODE_ENV 下面全部是在w ...

  5. node服务开发环境判断和启动端口指定---process.env.NODE_ENV

    在node启动的时候我们需要在代码里面判断服务器运行环境 可以根据process.env.NODE_ENV来判断 一.开发环境的判断 1.安装 npm i -g cross-env 2.启动 cros ...

  6. 关于如何在部署环境修改process.env & 本地测试

    前言 最近在搞一些监控的东西, 需要根据不同的环境上报到不同的地址,中间遇到了一些问题,在这里简单总结分享下. 关于process.env 假如你对process.env 相关的概念还不熟悉, 请移步 ...

  7. 理解webpack中的process.env.NODE_ENV

    参考资料 一. process 要理解 process.env.NODE_ENV 就必须要了解 process,process 是 node 的全局变量,并且 process 有 env 这个属性,但 ...

  8. 理解webpack之process.env.NODE_ENV详解(十八)

    在node中,有全局变量process表示的是当前的node进程.process.env包含着关于系统环境的信息.但是process.env中并不存在NODE_ENV这个东西.NODE_ENV是用户一 ...

  9. Ubuntu中配置Java环境变量时,出现command not found问题解决记录

    百度出Ubuntu中配置Java环境变量时,在利用sudo gedit /etc/profile 对profile编辑后, 在terminal中输入 sudo source /etc/profile, ...

随机推荐

  1. RDD(二)——创建

    RDD的创建 1)从内存中创建 从集合中创建RDD,Spark主要提供了两种函数:parallelize和makeRDD val raw: RDD[Int] = sc.parallelize(1 to ...

  2. [GX/GZOI2019]旅行者(dijkstra)

    二进制分组SB做法没意思还难写还可能会被卡常其实是我不会写.用一种比较优秀的O(Tnlogn)做法,只需要做2次dijkstra.对原图做一次.对反图做一次,然后记录每个点的最短路是从k个源点中的哪个 ...

  3. Flink(六) —— 配置文件详解

    基础配置 #============================================================================== # Common #===== ...

  4. 使用js/jquery动态提交表单数据到搜索引擎或者接口

    现在一般需要用jquery等方式动态提交到某个接口,比如通过iframe <iframe id="mainIframe" name="mainIframe" ...

  5. plsql中文显示问号

    1. select userenv('language') from dual 2. 复制查询的值配置系统环境变量 NLS_LANG=AMERICAN_AMERICA.ZHS16GBK 3.配置系统环 ...

  6. A4988驱动42步进电机

    A4988步进电机驱动器驱动控制42步进电机速度,步进电机调速,调节驱动电流       1  A4988步进电机驱动器简介 方便使用,是我们这些用户最想要的,固有的名词和深入介绍在这就不多说了,您可 ...

  7. yii执行流程简单介绍

    1. 用户访问 http://www.example.com/index.php?r=post/show&id=1,Web 服务器执行入口脚本 index.php 来处理该请求.  2. 入口 ...

  8. [Windows] Access SMBIOS

    SMBIOS architecture System Management BIOS (SMBIOS) is the premier standard for delivering managemen ...

  9. 【Linux_Shell 脚本编程学习知识点、判断传入参数是否是 整数】

    判断脚本传入的参数是否是整数 常用的几种方法 完整Shell 脚本如下: #!/bin/sh ##################################################### ...

  10. Windows 10操作系统针对不同环境下的安装方法

    一.电脑系统能正常运行 1.解压win10镜像文件 到电脑的非系统分区,运行setup安装文件 2.点击setup应用程序,准备安装 3.准备安装 4.等待安装过程结束,重启即可. 二.光盘安装 1. ...