1つは、3つの違いです
通常。ルートディレクトリに.env.env.development.env.productionの3つのファイルを作成します。
.env 无论开发环境还是生产环境都会加载的配置文件
.env.development 开发环境加载的配置文件
.env.production 生产环境加载的配置文件
次に、環境変数の使用の簡単な例。
構成ファイルの属性名はVUE_APP_で始まる必要が
あり、.envファイルの内容は次のとおりであることに注意してください。
VUE_APP_testName = '无论开发还是生产环境都会执行的内容'
.env.developmentファイルの内容：
VUE_APP_testName = '测试环境下内容'
.env.productionファイルの内容
VUE_APP_testName = '生产环境下的内容'
まず、Vue起動時に、開発環境であろうと本番環境であろうと、常に.envファイルの内容をロードし、次に=>根据Node环境变量'NODE_ENV'的值来选择加载'development'还是'production'
第三に、ノード環境変数とは何ですか、そしてなぜそれを使用して開発または本番のどちらをロードするかを決定できるのですか？
これは、ノードのグローバル変数プロセスから始まります。
ノードのグローバル変数が何であるかわからない場合は？ノードのグローバルな別のグローバル変数について考えてみてください。これは、次のものを含むオブジェクトでもあります。
__dirname: 当前文件所在文件夹的绝对路径
__filename: 当前文件的绝对路径
setInterval / clearInterval : 和浏览器中window对象上的定时器一样
setTimeout / clearTimeout : 和浏览器中window对象上的定时器一样
console : 和浏览器中window对象上的打印函数一样
このような一連の属性を使用すると、より慣れることができます。！
最初のポイント：
ノードでは、グローバル変数プロセスは現在のノードプロセスを表します。process.envには、システム環境に関する情報が含まれています。
つまり、processは、ノードのオペレーティング環境の下部に作成されたグローバル変数であり、ノード環境に関連する構成情報を格納します。jsコードがノードでローカルに実行されると仮定すると、プロセスを直接出力できます。
これは、ノード環境ではなくブラウザ環境であるため、ブラウザコンソールには出力されません。この2つには違いがあります。
2番目のポイント：process.env.NODE_ENVとは何ですか？
ただし、NODE_ENVはprocess.envに存在しません。NODE_ENVはユーザー定義変数であり、webpackでの目的は、実稼働環境、開発環境、またはテスト環境を判断することです。
つまり、NODE_ENVという名前のプロパティがwebpackのprocess.envオブジェクト用に構成されています。そして、この属性を使用して、それが実稼働環境であるか、開発環境であるか、テスト環境であるかを判別します。
前のトピックに戻ります。
通常npm run serve起動すると、ローカルシステムの環境変数NODE_ENV値はデフォルトでwebpackによってyesに設定されますdevelopment。
現時点では、main.jsなどのプロジェクトで印刷します。
console.log(process.env.NODE_ENV)
また、npm runserveを実行すると、最初に.envが実行され、次に2つのファイル.env.developmentが実行されます。
次に、ファイルを順番にロードするVueと、次にロードされるファイルの内容が、前にロードされたファイルの内容と比較されます。同じ名前の変数がある場合は、采用后一个文件里的变量值为变量的最终值。（つまり、後で上書きが実行される前の変数の割り当て）
以前に構成された3つのファイルを確認します。このプロジェクトがnpmrunserveで実行されている場合は、この変数をmain.jsに直接出力します。
そして、それをサーバーにパッケージ化するとき（npm run build）、サーバーのNODE_ENV値は通常ですproduction。その後、Vueは最初.envにファイルをロードし、次に.env.productionファイルをロードします。
これは、この時点で印刷することです。
console.log(process.env.NODE_ENV) //production