# VueCli 環境變數 (6-6)
###### tags: `Vue`、`6. VueCli`
2022.3.11

  環境變數會依照使用模式，判斷是否能被呼叫。

開發專案會有不同環境：

   1. 測試機環境 (development) : 大家共同開發，測試系統的地方。
   2. 正式機環境 (production) : 產品正式上線的地方。
   3. 本地環境 (Local) : 各人主機。

  為了區分變數使用範圍，VueCli提供在不同環境下專門使用變數，的設定變數方法，以下為設定不同變數的檔名。

.env                       //在所有環境中被載入
.env.local                 //在所有環境中被載入，但會被git忽略

.env.[mode]                //只會在特定環境下被載入
    .env.production            //只會在「正式機環境」被載入
    .env.development           //只會在「測試機環境」被載入

.env.[mode] .local         //只會在特定環境下被載入，但會被git忽略

## 設定環境變數 (.env)
> 注意：要重新跑 npm rum serve 變數才會顯示。

### 1. 首先新建.env檔案，並在裡面設定變數。
#### 變數設法 : `VUE_APP_變數名稱 = 這是一串文字`

### 2. 變數呼叫

## 設定環境變數 (.env.特定模式)
> 注意：要跑 npm rum build 變數才會顯示。