在 TypeScript 中为 process.env 定义类型

作者

在 TypeScript 中定义 process.env 的类型

Define types for process.env in TypeScript

在 TypeScript 中为 process.env 定义类型：

  1. 创建一个environment.d.ts文件并在全局命名空间中声明类型。
  2. 将属性添加到ProcessEnv界面。
  3. 通过使用使文件成为一个模块export {}。

在src您的项目目录中，创建一个types包含以下environment.d.ts文件的目录。

src/类型/environment.d.ts
export {};

declare global {
  namespace NodeJS {
    interface ProcessEnv {
      DB_PORT: number;
      DB_USER: string;
      ENV: 'test' | 'dev' | 'prod';
    }
  }
}

上面的示例显示了如何为对象的DB_PORT,DB_USER和
ENV属性添加类型process.env。

确保根据您的用例调整属性的名称。

现在我可以访问process.env对象的属性并获得自动完成功能。

索引.ts
console.log(process.env.DB_USER);
console.log(process.env.ENV);
console.log(process.env.DB_PORT);

然而，它们的值undefined现在是正确的，因为我们还没有建立一个
.env文件。

如果您已尝试重新启动 IDE，但仍未获得process.env对象上指定属性的自动完成，请尝试将
types目录路径添加到tsconfig.json文件中。

tsconfig.json文件
{
  "compilerOptions": {
    // ... rest
    "typeRoots": ["./node_modules/@types", "./src/types"]
  }
}

我们使用文件中的export {}行将environment.d.ts其标记为外部模块。模块是至少包含 1 个importor
export语句的文件。我们必须这样做才能扩大全球范围。

TypeScript.d.ts在查找常规文件的相同位置查找.ts文件，这由文件中的和设置决定。 includeexclude tsconfig.json

要为process.env对象的指定属性添加值，我们需要安装dotenv包。

在项目的根目录中打开终端并运行以下命令：

壳
npm install dotenv
npm install -D @types/node

.env现在在项目的根目录中创建一个文件。

.env
DB_PORT=9999
DB_USER=james_doe
ENV=test
确保将.env文件添加到您的.gitignore，尤其是当您在公共存储库上工作时。

在您的index.ts文件中，在导入任何其他内容之前，导入并初始化dotenv包。

索引.ts
import 'dotenv/config';

console.log(process.env.DB_USER); // 👉️ "james_doe"
console.log(process.env.ENV); // 👉️ "test"
console.log(process.env.DB_PORT); // 👉️ "9999"
加载和初始化 dotenv 包作为文件中的第一件事非常重要index.ts，特别是如果您有其他文件需要访问环境变量。

如果在初始化之前导入另一个文件dotenv，则最终会在对象的属性设置之前运行这些文件process.env。

现在重新启动您的开发服务器，您应该会看到
process.env对象的属性打印出指定的值。

处理环境属性成功

请注意，该DB_PORT属性的值为 type ，即使我们在文件中将其设置为数字。 string .env

如果您不确定是否process.env会填充对象的特定属性，请将其标记为可选。

src:/types/environment.d.ts
export {};

declare global {
  namespace NodeJS {
    interface ProcessEnv {
      DB_PORT?: number; // 👈️ mark optional
      DB_USER: string;
      ENV: 'test' | 'dev' | 'prod';
    }
  }
}

我们
使用问号将该DB_PORT属性标记为
可选。

这意味着它要么是指定的类型，要么是undefined.

当您希望在代码中执行操作之前必须检查属性是否存在时，这很有用。

索引.ts
console.log(process.env.DB_PORT || ''); // 👉️ "9999" or '', but not undefined

如果您尝试访问某个值的内置方法undefined，则会出现运行时错误，因此当我们不确定属性是否会被设置时，最好使用可选属性。

–

发表评论