process.env.NODE_ENV理解

1、NODE_ENVを理解します

ノードでは、グローバル変数プロセスは、現在のノードのプロセスを表してあります。process.envは、システム環境に関する情報が含まれています。しかしprocess.env NODE_ENVは、この事は存在しません。NODE_ENVは、ユーザー定義変数、本番環境でのWebPACKでの使用又は決定されたベースの開発環境です。

これは、グローバル変数ノードのプロセスであり、このプロセスは、ENV性質を持っていますが、このプロパティはNODE_ENVではありません。

process.envプロパティは、ユーザーの情報環境を含むオブジェクトを返し、それが公式によると、開発環境や環境を区別することができます

2、DefinePluginの意味を理解します

説明する公式サイトです：DefinePluginは、コンパイル時に設定することができ、私たちは、グローバル変数を作成することができますので、我々は、開発環境と正式な環境を区別するために、グローバル変数を設定するには、このプロパティを使用することができます。これはDefinePluginの基本的な機能です。

だから我々はWebPACKのは、グローバル設定変数をコンパイルする時間ので、webpack.config.jsグローバル変数の設定情報に次のコードを追加することができます。次のコードを：

module.exportsは= { 
  プラグイン：[ 
    // 设置环境变量信息
    新しいwebpack.DefinePlugin（{ 
      PRODUCTION：JSON.stringify（真）、
      VERSION：JSON.stringify（' 5fa3b9 ' ）、
      BROWSER_SUPPORTS_HTML5：真、
      TWO：「1 + 1 ' ' typeof演算窓'：JSON.stringify（' オブジェクト' ）、
       ' process.env ' ：{ 
        NODE_ENV：JSON.stringify（process.env.NODE_ENV）
      } 
    }）
  ]
}

パッケージ構成は、次のコマンドをpackage.json：

" スクリプト" ：{
   " DEV "：" のWebPACK-devのサーバー--progress --colorsが安い・モジュール-EVAL-ソースマップ--hot --inlineを--devtool " 、
   " ビルド"：" WebPACKの--progress --colorsは安いモジュール・ソース・マップを--devtool " " DLL：ビルド"：" のWebPACK --config webpack.dll.config.js " 
}、

例えば、次のコード：この設定が完了したら、それは実行のdevのNPMパッケージ後に実行グローバル変数、であるかどうかを確認するために、我々は我々のプロジェクトでは入り口のjsファイルは、次を印刷することができますすることができます：

console.log（' 実行しているアプリケーションのバージョン' + VERSION）; // 打印実行アプリのバージョン5fa3b9の 
はconsole.log（PRODUCTION）。// 打印真 
にconsole.log（process.env）。// 打印{NODE_ENV：未定義}

あなたが定義されていないprocess.env.NODE_ENV情報を印刷見ることができるように、我々はpackage.jsonファイルで構成されていないので、それがあります。ここでは、パッケージは次のようなコードになるコマンド、変数値package.json NODE_ENVを追加します。

" スクリプト" ：{
   " DEV "：" NODE_ENV =開発のWebPACK-devのサーバー--progress --colorsが安い・モジュール-EVAL-ソースマップを--devtool --hot --inline " 、
   " ビルド"：" NODE_ENV =生産のWebPACK --progress --colors --devtool安い・モジュール・ソース・マップ" " ビルド：DLL "：" のWebPACK --config webpack.dll.config.js " 
}、

コマンドDEV包装、コマンドによって先行NODE_ENV =開発包装コマンドとして、コマンド・パッケージ・ビルドフロントNODE_ENV =生産を追加し、したがってコードの結果を表示し続けて次のようになります。

console.log（' 実行しているアプリケーションのバージョン' + VERSION）; // 打印実行アプリのバージョン5fa3b9の 
はconsole.log（PRODUCTION）。// 打印真 
にconsole.log（process.env）。// 打印{NODE_ENV '開発'}

これは、前述したように、我々が設定することが可能な開発環境と正式な環境を区別するために、プロジェクトにパッケージ化する場合にのみprocess.env.NODE_ENV値、見て、その後、このprocess.env.NODE_ENVでwebpack.config.jsによってすることができます正式な環境または開発環境を区別することができます。

転載https://www.cnblogs.com/tugenhua0707/p/9780621.html

おすすめ