Vite 配置不同环境跨域

1. 版本

• vite: 3.x
• TypeScript: 4.6.x

2. 配置

需要在 vite.config.ts 文件中 配置 server 选项，具体配置如下：

import { ConfigEvn, loadEnv } from 'vite'
import type { UserConfig } from 'vite'
import path from 'path'

export default ({ command, mode }: ConfigEnv): UserConfig => {
  const root = process.cwd()
  const env = loadEnv(mode, root)

  return {
    server: {
	  proxy: {
	    [env.VITE_BASE_URL]: {
	      target: env.VITE_API_URL,
	      changeOrigin: true,
	      rewrite: path => path.replace(new RegExp(`^${env.VITE_BASE_URL}`), '')
	    }
	  }
	}
  }
}

可以根据自己的项目需求，将以 VITE_XX 开头的变量定义在根目录中的 .env.development[production | staging] 文件中,分别对应开发[生产，测试]环境，文件名称如下：

例如 .env.development 文件中：

# 前缀地址
VITE_BASE_URL = '/dev-api'

# 请求路径
VITE_API_URL = 'http://192.168.x.x:8081'