vue-cli3.0プロセスの構成env.NODE_ENV

ルートディレクトリの下に3つの.envファイル

を新規作成する.

NODE_ENV=dev
VUE_APP_URL=http://192.168.14.22

NODE_ENV=prod
VUE_APP_URL=https://www.baidu.com

NODE_ENV=test
VUE_APP_URL=https://test.baidu.com

以上の3つのファイルのローカル環境、本番環境、テスト環境にそれぞれ対応

は、vue.config.jsファイルに対応する変数を構成し、異なる環境で異なるフォルダにパッケージ化します.

module.exports = {
    lintOnSave: false,
    outputDir: `dist-${process.env.NODE_ENV}`
}

package-lock.jsonファイルのscriptタグに

を追加する.

scripts": {
    "serve": "vue-cli-service serve --mode dev",
    "build.test": "vue-cli-service build --mode test",
    "build": "vue-cli-service build --mode prod"
  },

検証***********************************************************************************************************************************************************************************************************************************************************************************************************main.jsまたはconsole.log(process.env.VUE_APP_URL)コマンドパッケージ表示生成されたファイル名コンソールの印刷結果を個別に表示