request.js(其他js文件)中怎么获取.env数据import.meta.env
const baseUrl = import.meta.env.VITE_BASE_URL
app.vue中怎么获取.env数据import.meta.env
<script setup>
const baseUrl = import.meta.env.VITE_BASE_URL
//const title = ref(import.meta.env.VITE_BASE_URL)
</script>
vite.config.js中怎么获取.env数据loadEnv(mode, process.cwd(), '')
import { loadEnv } from 'vite'
export default (config) => {
const viteEnv = loadEnv(config.mode, process.cwd())
const { VITE_BASE_URL } = viteEnv
return {
base: VITE_BASE_URL,
}
}
vite.config.js
vite默认不加载.env文件,会在执行完vite配置后才确定加载哪个,如果需要在vite.config.js中读取参数值,需要以下操作,通过const env = loadEnv(mode, process.cwd(), '')获取.env信息
import { loadEnv } from 'vite'
import vue from '@vitejs/plugin-vue'
import * as path from 'path' //
// https://vitejs.dev/config/
export default (config) => {
const viteEnv = loadEnv(config.mode, process.cwd())
const { VITE_BASE_URL } = viteEnv
return {
plugins: [vue()],
base: VITE_BASE_URL,
resolve: {
alias: {
'~': path.resolve(__dirname, './'), // 设置路径
'@': path.resolve(__dirname, 'src'), // 设置别名
},
extensions: ['.js', '.ts', '.jsx', '.tsx', '.json', '.vue'],
},
css: {
preprocessorOptions: {
scss: {
additionalData: `@use "./src/styles/element.scss" as *;`,
},
},
},
server: {
port: 5173,
host: true,
hmr: true,
watch: {
usePolling: true, // 修复HMR热更新失效
},
open: true, //是否自动在浏览器打开
proxy: {
'/child-web': {
target: 'http://localhost:8080',
pathRewrite: {
'^/child-web': '/child-web',
},
changeOrigin: true,
}
},
},
}
}
config:
{
mode: 'development',
command: 'serve',
isSsrBuild: false,
isPreview: false
}
viteEnv:
.evn中的参数命名必须加VITE_
{
VITE_EVN: 'development',
VITE_BASE_URL: '/config-web/',
}
vite.config.ts
/*
* @Author: yangmiaomiao
* @Date: 2024-06-15 16:58:07
* @LastEditors: yangmiaomiao
* @LastEditTime: 2024-07-01 14:34:40
* @Description:
*/
import { type ConfigEnv, type UserConfigExport, defineConfig, loadEnv } from 'vite'
import * as path from 'path'
import vue from '@vitejs/plugin-vue'
import qiankun from 'vite-plugin-qiankun'
// https://vitejs.dev/config/
export default (config: ConfigEnv): UserConfigExport => {
const viteEnv = loadEnv(config.mode, process.cwd())
const { VITE_PUBLIC_PATH } = viteEnv
console.log('viteEnv', VITE_PUBLIC_PATH, viteEnv)
return {
base: VITE_PUBLIC_PATH,
plugins: [
vue(),
qiankun('child-web', {
//子应用名字,与主应用注册的子应用名字保持一致
useDevMode: true,
}),
],
resolve: {
alias: {
'~': path.resolve(__dirname, './'), // 设置路径
'@': path.resolve(__dirname, 'src'), // 设置别名
},
extensions: ['.js', '.ts', '.jsx', '.tsx', '.json', '.vue'],
},
server: {
host: true, //host:0.0.0.0
open: true, //是否自动打开浏览器页面
port: 8080, //端口号
origin: 'http://localhost:8080', //解决静态资源加载 404 问题
cors: true, //跨域设置 允许
strictPort: false, //端口被占用直接退出
// 代理配置
proxy: {
'/api': {
target: 'http://localhost:3000',
changeOrigin: true,
rewrite: (path) => path.replace(/^\/api/, ''),
},
'/eunomia-ctr': {
target: 'http://localhost:3000',
changeOrigin: true,
rewrite: (path) => path.replace(/^\/eunomia-ctr/, 'eunomia-ctr'),
},
},
},
}
}