♈️.env 文件配置

1️⃣ 文件說明

.env：全局默認配置文件，無論什么環境都會加載合並。

.env.development：開發環境的配置文件

.env.production：生產環境的配置文件

在這里插入圖片描述

注意：三個文件的文件名必須按上面方式命名，不能亂起名，否則讀取不到文件。

2️⃣ 內容格式

注意：屬性名必須以 VUE_APP_ 開頭，如：VUE_APP_XXX

3️⃣ 加載

vue 會根據啟動命令自動加載相對應的環境配置文件。vue是根據文件名進行加載的，所以上面說“不要亂起名，也無需專門控制加載哪個文件”

比如執行npm run serve命令，會自動加載.env.development文件

開發環境加載 .env 和 .env.development 。

生成環境加載 .env 和 .env.production 。

運行npm run serve的時候主要還是看package.json中 server屬性的--mode后面跟的是啥。如果是development，就會加載.env.development文件。

在package.json里面配置好，執行serve的時候用開發環境的。build打包用生產或者測試的

package.json 配置項： 二選一

"scripts": {
    "serve": "vue-cli-service serve --mode development",
    "build": "vue-cli-service build",
    "build:sit": "vue-cli-service build --mode production.sit",
    "build:uat": "vue-cli-service build --mode production.uat",
    "build:prod": "vue-cli-service build --mode production",
    "lint": "vue-cli-service lint",
    "et": "node_modules/.bin/et",
    "et:init": "node_modules/.bin/et -i",
    "et:list": "gulp themes"
  }

"scripts": {
    "serve-test": "vue-cli-service serve --open --mode test",
    "serve": "vue-cli-service serve --open --mode development",
    "dev": "vue-cli-service --open --mode development serve",
    "test-oss": "vue-cli-service --mode sit build",
    "build:sit": "vue-cli-service --mode sit build",
    "build:prod": "vue-cli-service --mode production build",
    "lint": "vue-cli-service lint",
    "fix": "tslint --fix -c ./tslint.json 'src/**/*{.ts,.tsx}'"
 }