一旦你在你的项目中安装了@types/node，你就可以告诉TypeScript process.env中到底有哪些变量:

environment.d.ts

declare global {
  namespace NodeJS {
    interface ProcessEnv {
      GITHUB_AUTH_TOKEN: string;
      NODE_ENV: 'development' | 'production';
      PORT?: string;
      PWD: string;
    }
  }
}

// If this file has no import/export statements (i.e. is a script)
// convert it into a module by adding an empty export statement.
export {}

用法:

process.env.GITHUB_AUTH_TOKEN; // $ExpectType string

此方法将为您提供智能感知，并且它还利用了字符串文字类型。

注意:上面的代码片段是模块扩展。包含模块扩展的文件必须是模块(而不是脚本)。模块和脚本的区别在于模块至少有一个导入/导出语句。 为了让TypeScript把你的文件当成一个模块，只需要给它添加一个import语句。它可以是任何东西。甚至export{}也可以。

1. 创建一个.env文件

# Contents of .env file
AUTHENTICATION_API_URL="http://localhost:4000/login"
GRAPHQL_API_URL="http://localhost:4000/graphql"

2. 将.env文件加载到进程中。Env和dotenv

我们可以利用dotenv来设置特定于环境的过程。env变量。创建一个名为config的文件。t在你的src/目录中，并按如下方式填充:

// Contents of src/config.ts

import {config as configDotenv} from 'dotenv'
import {resolve} from 'path'

switch(process.env.NODE_ENV) {
  case "development":
    console.log("Environment is 'development'")
    configDotenv({
      path: resolve(__dirname, "../.env.development")
    })
    break
  case "test":
    configDotenv({
      path: resolve(__dirname, "../.env.test")
    })
    break
  // Add 'staging' and 'production' cases here as well!
  default:
    throw new Error(`'NODE_ENV' ${process.env.NODE_ENV} is not handled!`)
}

注意:这个文件需要导入到最顶层的文件中，可能是src/index文件。Ts通过import '。/config'(放置在所有其他导入之前)

3.检查ENV变量并定义IProcessEnv

在组合了上面的几个方法之后，我们可以添加一些运行时检查，以确保我们声明的IProcessEnv接口反映了在. ENV中设置的ENV变量。*文件。下面的内容也可以保存在src/config.ts中

// More content in config.ts
const throwIfNot = function<T, K extends keyof T>(obj: Partial<T>, prop: K, msg?: string): T[K] {
  if(obj[prop] === undefined || obj[prop] === null){
    throw new Error(msg || `Environment is missing variable ${prop}`)
  } else {
    return obj[prop] as T[K]
  }
}
// Validate that we have our expected ENV variables defined!
['AUTHENTICATION_API_URL', 'GRAPHQL_API_URL'].forEach(v => {
  throwIfNot(process.env, v)
})

export interface IProcessEnv {
  AUTHENTICATION_API_URL: string
  GRAPHQL_API_URL: string
}

declare global {
  namespace NodeJS {
    interface ProcessEnv extends IProcessEnv { }
  }
}
   

这将为我们提供适当的智能感知/tslint类型检查，以及部署到各种环境时的一些理智。

注意，这也适用于ReactJS应用程序(而不是NodeJS服务器应用程序)。你可以省略步骤(2)，因为这是由create-react-app处理的。

还可以使用类型保护函数。像这样，返回类型是

parameterName is string

如。

function isEnvVarSpecified(envVar: string | undefined): envVar is string {
  if(envVar === undefined || envVar === null) {
    return false;
  }
  if(typeof envVar !== 'string'){
    return false;
  }
  return true;
}

然后你可以调用它作为类型保护:

function myFunc() {
  if(!isEnvVarSpecified(process.env.SOME_ENV_VAR')){
      throw new Error('process.env.SOME_ENV_VAR not found')
  }
  // From this point on the ts compiler won't complain about 
  // process.env.SOME_ENV_VAR being potentially undefined
}

使用节点进程的最佳和最简单的方法。你的typescript项目中的env是首先用tsc编译，然后用node提供你的env var运行编译后的javascript文件。ts是你想要的输出目录也是编译文件的名称，我使用dist作为输出目录和index.js为例):

cd my-typescriptproject
tsc
NODE_ENV=test node ./dist/index.js

补充了之前的回答，并在一段时间后解决了这个问题，甚至安装了@types/node，我找到了这个答案。简而言之，只需要运行一个重载窗口:

＂...不过，如果typescript语言服务器仍然使用以前版本的tsconfig，则可能需要重新启动它。为了在VS Code中做到这一点，你可以按Ctrl+Shift+P并重新加载窗口或TypeScript:如果可用，重新启动TS服务器……”

对于任何来这里寻找Create React App项目答案的人，你的变量名应该以REACT_APP_开头

更多信息请点击:https://facebook.github.io/create-react-app/docs/adding-custom-environment-variables