環境變數 Quasar解決歷程:

解法一:

目前測試 quasar dev 預設就會吃到.env.development的環境變數(在本地只要改此.env.development 的內容即可方便於本地測試各種環境)

至於其他build的環境變數:

    "dev": "quasar dev",
    "build:testing": "quasar build -e testing",
    "build:agent": "quasar build -e agent",
    "build:generalAgent": "quasar build -e generalAgent",
    "build:staging": "quasar build -e staging",

原本理想下希望可以透過環境變數後墜-e 區分各個環境變數, 經測試後不可行

解法二:

給本地開發用:
windows: set VITE_MODE=Agent && quasar dev
OS: VITE_MODE=Agent quasar dev

在quasar.config.js

  env: {
    VITE_MODE: process.env.VITE_MODE,
  },

在hook/useEnv中

export function useEnv() {
  /*
    isMode 有以下三種狀態, 由於有三種狀態, 不可再用true/false去判斷
    總控: .env.tesing => Admin
    總代: .env.agent => Agent
    代理: .env.generalAgent => GeneralAgent
  */
  const getModeEnv = () => {
    console.log(import.meta.env)
    switch (import.meta.env.VITE_MODE) {
      case 'agent':
        return {
          VITE_APP_TITLE: 'Quasar Core',
          VITE_APP_BASE_API: 'https://staging.gsimw.com/api',
          VITE_APP_MODE: 'agent',
          VITE_APP_SITE_VERSION: '0.0.0'
        }
      case 'generalAgent':
        return {
          VITE_APP_TITLE: 'Quasar Core',
          VITE_APP_BASE_API: 'https://staging.gsimw.com/api',
          VITE_APP_MODE: 'generalAgent',
          VITE_APP_SITE_VERSION: '0.0.0'
        }
      case 'admin':
        return {
          VITE_APP_TITLE: 'Quasar Core',
          VITE_APP_BASE_API: 'https://staging.gsimw.com/api',
          VITE_APP_MODE: 'admin',
          VITE_APP_SITE_VERSION: '0.0.0'
        }

      default:
        return {
          VITE_APP_TITLE: 'Quasar Core',
          VITE_APP_BASE_API: 'https://localhost:8080/api',
          VITE_APP_MODE: 'admin',
          VITE_APP_SITE_VERSION: '0.0.0'
        }
    }
  }
  const envData = () => getModeEnv()
  // const version = () => process.env.VUE_APP_SITE_VERSION

  return {
    envData,
    // isMode,
    // version
  }
}

PS: 在不同作業系統下會有不同寫法