如何向 TypeScript 项目中添加 .env 并使用 process.env

最近我在项目中遇到了这个问题，但通过谷歌搜索和Stack Overflow查找的答案往往不完整且令人困惑。
因此，我决定记录下我的解决方案，希望能对其他人有所帮助。

首先安装 dotenv 包

npm install dotenv;
 OR 
yarn add dotenv;

将其导入到代码的入口点。这通常是index.ts、main.ts 或 app.ts文件。

import * as dotenv from 'dotenv';

//inside your starter code, do this
...
...
dotenv.config();
...

现在您可以将 process.env.ENVIRONMENT_VARIABLE 应用于您的项目中。

不过，我建议创建一个配置模块来存放所有环境变量。这种方法有很多优点，例如：

• 代码重构更便捷：只需在一个地方即可更新或更改任何环境变量的键值或默认值。这比在所有文件中搜索变量名要高效得多。
• 易于测试：您可以模拟或拦截此操作。
• 简洁的代码：这种方法模块化程度高，代码编写量少。

您的配置模块可能如下所示：endpoints.config.ts

export default {
 UserBaseUrl: process.env.USER_SERVICE_URL ?? '',
 EtlUrl: process.env.ETL_SERVICE_URL ?? ''
}

现在，在你的代码中，你可以这样做：

import endpoint from '../endpoints.config';
... 
...
const user = await axios.get(endpoint.UserBaseUrl, { params})
...

就是这样！如果我遗漏了什么或者您遇到任何问题，请随时留言。
谢谢！