Vue.js - 現在の環境が開発環境か本番環境かを判断する (サンプル付き)

1. 判定例
(1) 現在のプロジェクトが開発環境であるか本番環境であるかをコード上で判断し、環境に応じて異なるロジックコードを実行する必要がある場合があります。簡単な例を次に示します。

if (process.env.NODE_ENV === "development") {
    
    
  alert("开发环境");
}else {
    
    
  alert("生产环境");
}

(2) 開発環境の場合(npm run dev実行時)、以下の結果が表示されます。

(3) 本番環境の場合(npm run build実行時)、以下の結果が表示されます。 2.

判定原理
(1) コンフィグレーションにはdev.env.jsとprod.env.jsの2つのファイルがあります。プロジェクトのフォルダー。開発環境の変数と本番環境の変数をそれぞれ構成します。

(2) dev.env.js ファイルを開くと、NODE_ENV 変数の値がdevelopmentであることがわかります。

'use strict'
const merge = require('webpack-merge')
const prodEnv = require('./prod.env')
 
module.exports = merge(prodEnv, {
    
    
  NODE_ENV: '"development"'
})

(3) prod.env.js ファイルを開くと、NODE_ENV 変数の値がproductionであることがわかります。

'use strict'
module.exports = {
    
    
  NODE_ENV: '"production"'
}

転載先: https://www.hangge.com/blog/cache/detail_2497.html