npm 包 envarify 使用教程

什么是 envarify？

envarify 是一个 npm 包，它可以在 JavaScript 或 TypeScript 项目中，将环境变量从 process.env 注入到代码中，以便在代码中读取和使用这些环境变量。它通过在编译期间在代码中插入环境变量，而不是在运行时解析它们来工作。

安装 envarify

使用 envarify 很简单，首先需要在项目中安装它：

npm install envarify --save-dev

这里使用的是 --save-dev 标记，因为 envarify 是一个开发依赖。它只需要在开发期间使用。

配置 envarify

使用 envarify 很容易，只需在你的项目中创建一个 .env 文件，其中包含你的环境变量，如下所示：

MY_VAR=value
OTHER_VAR=other_value

在你的 JavaScript 或 TypeScript 代码中，可以使用 process.env 来访问这些环境变量。例如，要访问 MY_VAR 变量，可以这样做：

console.log(process.env.MY_VAR);

但是，当你使用 envarify 时，你需要将它添加到你的项目的构建过程中。在大多数情况下，你可以使用你的项目的打包器或构建工具来完成这项工作。在下面的示例中，我们使用 webpack 来演示如何配置 envarify。

在 webpack 配置文件中，做出如下更改：

const envarify = require('envarify/webpack');

module.exports = {
  // ...
  plugins: [
    envarify(),
  ],
};

这将在编译过程中将你的环境变量注入到你的代码中。

示例代码

在下面的示例中，我们将演示如何使用 envarify 来注入环境变量并将其读入 JavaScript 或 TypeScript 代码中。

1. 创建一个名为 index.ts 的 TypeScript 文件，该文件包含以下内容：

console.log(`My var is: ${process.env.MY_VAR}`);

1. 创建一个名为 .env 的文件，该文件包含以下内容：

MY_VAR=my value

1. 在项目中安装 envarify：

npm install envarify --save-dev

1. 在 webpack 配置文件中添加 envarify：

const envarify = require('envarify/webpack');

module.exports = {
  // ...
  plugins: [
    envarify(),
  ],
};

1. 使用 webpack 来构建你的项目：

npx webpack

1. 运行你的应用程序：

node dist/index.js

输出将如下所示：

My var is: my value

指导意义

使用 envarify 可以帮助你更轻松地在 JavaScript 或 TypeScript 项目中管理环境变量。它简化了访问变量的过程，并且可以在代码构建过程中处理它们，避免了在运行时解析变量的成本。这一点对于大型应用程序尤其重要，因为在运行时处理大量环境变量可能导致性能瓶颈。

下一步是在你的项目中尝试使用 envarify，看看它如何帮助你更轻松地管理环境变量和代码。

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005694681e8991b448e4c6d