迹忆客 专注技术分享

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

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

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

src/types/environment.d.ts

export {};

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

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

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

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

index.ts

console.log(process.env.DB_USER);
console.log(process.env.ENV);
console.log(process.env.DB_PORT);

但是，它们的值现在是 undefined 的，因为我们还没有设置 .env 文件。

如果我们已尝试重新启动 IDE，但仍无法自动完成 process.env 对象上的指定属性，请尝试将类型目录的路径添加到 tsconfig.json 文件中。

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

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

TypeScript 在查找常规 .ts 文件的相同位置查找 .d.ts 文件，这取决于 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 包。

index.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 属性具有字符串类型的值，即使我们在 .env 文件中将其设置为数字。

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

export {};

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

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

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

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

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

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