vue使用vite設定跨域以及環境設定詳解

2022-07-13 14:00:55

如何設定跨域，代理域名

不管使用什麼腳手架，設定代理都是繞不開的話題，下面是vite的代理

server: {
    proxy: {
      '/api': {
        target: 'https://baidu.com',
        changeOrigin: true,
        rewrite: (path) => path.replace(/^/api/, '')
      }
    }
 },

區分開發環境和生產環境，以及預釋出環境

在根目錄建立 .env[mode] 檔案，在專案執行 npm run dev 的時候vite會自動去讀取.env.development檔案裡面的設定，執行npm runbuild進行打包之後也會自動將.env.production的內容打包進去，這裡注意的是，如果你想進入預釋出模式的話需要在打包的時候進行mode設定:npm run build --mode staging
公共的 .env
開發環境 .env.development
生產環境 .env.production
預釋出環境 .env.staging

在.env.development設定了一個域名:

`.env.development`
// 開發環境設定
VITE_BASIC_URL = https://basic.com

可以做什麼事

針對不同的環境可以去設定，例如頁面的統一標題，引數常數…
下面根據環境設定不同的請求域名

vue使用vite設定跨域以及環境設定詳解

目錄

如何設定跨域，代理域名

區分開發環境和生產環境，以及預釋出環境

可以做什麼事

熱門文章