[英]How can I use Vite env variables in vite.config.js?
在我的 Vite 項目中使用以下.env
:
# To prevent accidentally leaking env variables to the client, only
# variables prefixed with VITE_ are exposed to your Vite-processed code
VITE_NAME=Wheatgrass
VITE_PORT=8080
如何在我的vite.config.js
VITE_PORT
您可以加載app level
的環境變量並將它們添加到Node level
的環境變量中:
import { defineConfig, loadEnv } from 'vite';
import vue from '@vitejs/plugin-vue';
export default ({ mode }) => {
process.env = {...process.env, ...loadEnv(mode, process.cwd())};
// import.meta.env.VITE_NAME available here with: process.env.VITE_NAME
// import.meta.env.VITE_PORT available here with: process.env.VITE_PORT
return defineConfig({
plugins: [vue()],
server: {
port: process.env.VITE_PORT,
},
});
}
如果@matt 的上述解決方案對您不起作用,請更改vite.config.ts
/ vite.config.js
如下所示
第一種解決方案
import { defineConfig, loadEnv } from 'vite';
import vue from '@vitejs/plugin-vue';
export default defineConfig(({ mode }) => {
const env = loadEnv(
'mock',
process.cwd(),
''
)
const processEnvValues = {
'process.env': Object.entries(env).reduce(
(prev, [key, val]) => {
return {
...prev,
[key]: val,
}
},
{},
)
}
return {
plugins: [vue()],
define: processEnvValues
}
}
第二個解決方案
import { defineConfig, loadEnv } from 'vite';
import vue from '@vitejs/plugin-vue';
export default ({ mode }) => {
process.env = Object.assign(process.env, loadEnv(mode, process.cwd(), ''));
return defineConfig({
plugins: [vue()],
});
}
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.