vite 使用 process.env

.env.development

?

1 2 3 4 5

VITE_HOST = '127.0.0.1' VITE_PORT = 3003 VITE_BASE_URL = './' VITE_OUTPUT_DIR = 'dist1' VITE_API_DOMAIN = 'http://ip:8080/' //本地环境地址（可用于开发时联调）

　.env.production

?

1 2 3 4 5

VITE_HOST = '127.0.0.1' VITE_PORT = 3005 VITE_BASE_URL = './' VITE_OUTPUT_DIR = 'dist' VITE_API_DOMAIN = 'http://ip:8080/'

vite.config.js

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30

import vue from '@vitejs/plugin-vue' import {defineConfig, loadEnv} from "vite";   export default ({command, mode}) => {     const envConfig = loadEnv(mode, './');     let config = {         base: './',         plugins: [vue()],         optimizeDeps: {             include: ['schart.js']         },         server: {             host: envConfig.VITE_HOST,             port: envConfig.VITE_PORT,             // 是否自动在浏览器打开             open: true,             // 是否开启 https             https: false,             // 服务端渲染             ssr: false,             base: envConfig.VITE_BASE_URL,             outDir: envConfig.VITE_OUTPUT_DIR,             define: {                 'process.env': {}             }         },     };       return defineConfig(config) }

package.json

?

1 2 3 4 5 6

"scripts": {     "dev": "vite --mode development",     "test": "vite  --mode testing",     "prod": "vite  --mode production",     "serve": "vite preview"   },

引入环境配置

?

1	import.meta.env.VITE_API_DOMAIN