在 TypeScript 中为 process.env 定义类型

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

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

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

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

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

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

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

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

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

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

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

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

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

现在重新启动我们的开发服务器,我们应该会看到 process.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

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