---
title: 加入環境變數
tags: vue
---

# 環境變數的讀取順序
* 預設只有VITE_開頭的變數才會讀取
* https://cn.vitejs.dev/guide/env-and-mode.html#modes

.env                # 所有情况下都会加载
.env.local          # 所有情况下都会加载，但会被 git 忽略
.env.[mode]         # 只在指定模式下加载
.env.[mode].local   # 只在指定模式下加载，但会被 git 忽略

# 加入.env

VITE_APP_TITLE=Admin Web
VITE_PORT=3010

# 安裝@types/node

npm i -D @types/node

# 調整vite.config.ts

export default defineConfig(({ command, mode }: ConfigEnv): UserConfig => {
  const root = process.cwd();
  const { VITE_PORT } = loadEnv(mode, root);
  
  return {
    root,
    plugins: [
      vue(),
    ],
    server: {
      host: false,
      port: +VITE_PORT,
      https: false,
      open: false,
    },
  };
});