Svelte 框架:环境变量未出现在 Svelte 应用程序中
Svelte framework: environment variables not appearing in svelte app
我正在尝试在我的 svelte 应用程序中使用环境变量。我已经安装了 @Rollup/plugin-replace
和 dotenv
。我创建了一个 .env
文件来保存我的 API_KEY
并从这个 Medium article:
添加了以下内容到 rollup.config.js
中的 plugins
plugins: [
replace({
__myapp: JSON.stringify({
env: {
isProd: production,
API_URL : process.env.API_URL
}
}),
}),
]
在我的应用程序的精巧组件中,我将通过
访问我的 API 密钥
const apiUrl = __myapp.env.API_URL
有效。然而,几天后我遇到了身份验证问题,经过一些调试后我发现 __myapp.env.API_URL
通过尝试将其打印到控制台返回 undefined
。
然后我尝试将 replace
调用更改为 replace({'API_KEY': process.env.API_KEY})
,而 console.log(API_KEY)
仍然显示 undefined
。我通过尝试使用它用一些字符串替换一些变量来测试 replace
并且它有效以确认汇总工作正常。所以,我怀疑问题出在 process.env.API_KEY
但我不确定。我尝试访问环境变量时可能做错了什么?
(一些背景:我正在使用 sveltejs/template 作为构建我的应用程序的模板)
在您调用 config
之前,dotenv
不会注册您的 .env
变量,这就是为什么当您尝试访问它时 process.env.API_KEY
未定义。
在你的rollup.config.js
中你可以做:
import { config as configDotenv } from 'dotenv';
import replace from '@rollup/plugin-replace';
configDotenv();
export default {
input: 'src/main.js',
...
plugins: [
replace({
__myapp: JSON.stringify({
env: {
isProd: production,
API_URL: process.env.API_URL,
},
}),
}),
svelte({ ... })
]
}
我正在尝试在我的 svelte 应用程序中使用环境变量。我已经安装了 @Rollup/plugin-replace
和 dotenv
。我创建了一个 .env
文件来保存我的 API_KEY
并从这个 Medium article:
rollup.config.js
中的 plugins
plugins: [
replace({
__myapp: JSON.stringify({
env: {
isProd: production,
API_URL : process.env.API_URL
}
}),
}),
]
在我的应用程序的精巧组件中,我将通过
访问我的 API 密钥const apiUrl = __myapp.env.API_URL
有效。然而,几天后我遇到了身份验证问题,经过一些调试后我发现 __myapp.env.API_URL
通过尝试将其打印到控制台返回 undefined
。
然后我尝试将 replace
调用更改为 replace({'API_KEY': process.env.API_KEY})
,而 console.log(API_KEY)
仍然显示 undefined
。我通过尝试使用它用一些字符串替换一些变量来测试 replace
并且它有效以确认汇总工作正常。所以,我怀疑问题出在 process.env.API_KEY
但我不确定。我尝试访问环境变量时可能做错了什么?
(一些背景:我正在使用 sveltejs/template 作为构建我的应用程序的模板)
config
之前,dotenv
不会注册您的 .env
变量,这就是为什么当您尝试访问它时 process.env.API_KEY
未定义。
在你的rollup.config.js
中你可以做:
import { config as configDotenv } from 'dotenv';
import replace from '@rollup/plugin-replace';
configDotenv();
export default {
input: 'src/main.js',
...
plugins: [
replace({
__myapp: JSON.stringify({
env: {
isProd: production,
API_URL: process.env.API_URL,
},
}),
}),
svelte({ ... })
]
}