简介
env-data 是一个 npm 包，用于在前端应用中管理环境变量和配置信息。
使用 env-data 可以：
- 简化前端代码中的环境变量和配置信息的管理；
- 提高应用的可维护性和可扩展性。
安装
你可以通过 npm 安装 env-data 包：
npm install env-data
使用
引入
在前端应用的入口文件中，首先需要引入 env-data。
import envData from 'env-data';
配置
env-data 的配置信息以 JSON 对象的形式传递。
以下是一个示例配置文件 env.json，可以保存在项目的根目录中：
{
"API_BASE_URL": "https://example.com/api",
"APP_NAME": "My Cool App",
"GOOGLE_API_KEY": "xyz123"
}在应用启动时，需要加载该配置文件。
import envData from 'env-data'; import envConfig from './env.json'; envData.loadConfig(envConfig);
使用
在代码中，可以通过 envData 对象获取配置信息或环境变量。
import envData from 'env-data';
console.log(envData.get('API_BASE_URL')); // https://example.com/api
console.log(envData.get('APP_NAME')); // My Cool App
console.log(envData.get('GOOGLE_API_KEY')); // xyz123高级用法
环境变量
env-data 还支持获取环境变量。环境变量可以用来保存敏感信息，如密码、密钥等。
例如，在 env.json 中添加一个环境变量：
{
"API_BASE_URL": "https://example.com/api",
"APP_NAME": "My Cool App",
"GOOGLE_API_KEY": "xyz123",
"DATABASE_PASSWORD": {
"env": "DATABASE_PASSWORD"
}
}然后，在代码中可以通过 envData 对象获取环境变量的值。
import envData from 'env-data';
console.log(envData.get('DATABASE_PASSWORD')); // 获取环境变量 DATABASE_PASSWORD 的值默认值
如果获取的配置项不存在，可以通过传入默认值来避免报错。
import envData from 'env-data';
console.log(envData.get('THIS_KEY_DOES_NOT_EXIST', 'default value')); // default value类型转换
env-data 支持将配置项的值转换为指定类型，如字符串、数字、布尔值等。
例如，在 env.json 中添加一个数字类型的配置项：
-- -------------------- ---- -------
-
--------------- --------------------------
----------- --- ---- -----
----------------- ---------
------- -
-------- -------
------- --------
-
-然后，在代码中可以获取该配置项并将其转换为数字类型。
import envData from 'env-data';
console.log(envData.getNumber('PORT')); // 3000层级结构
env-data 支持以对象结构的形式管理配置项，从而更好地组织和解析配置信息。
例如，在 env.json 中添加一个层级结构的配置项：
-- -------------------- ---- -------
-
--------------- --------------------------
----------- --- ---- -----
----------------- ---------
----------- -
------- ------------
------- -----
----------- -----------
----------- ----------
-
-然后，在代码中可以通过路径获取该配置项。
import envData from 'env-data';
console.log(envData.get('DATABASE.HOST')); // localhost
console.log(envData.get('DATABASE.PORT')); // 5432
console.log(envData.get('DATABASE.USERNAME')); // postgres
console.log(envData.get('DATABASE.PASSWORD')); // postgres结语
env-data 是一个非常有用的 npm 包，可以提高前端应用的可维护性和可扩展性。希望在实际开发中，你也可以充分利用该工具，构建出更加健壮和优秀的应用。
示例代码
以下是一个示例代码，展示了如何使用 env-data。
-- -------------------- ---- ------- ------ ------- ---- ----------- ------ --------- ---- ------------- -- ------ ------------------------------ -- ----- ----- ---------- - ---------------------------- ----- ------- - ------------------------ ----- ------------ - ------------------------------ ----- ---------------- - -------------------------------- -------- ----------- ----- ---- - -------------------------- ----- ------------ - ----------------------------- ----- ------------ - ----------------------------- ----- ---------------- - --------------------------------- ----- ---------------- - --------------------------------- -- ----- ---------------------------- ------------ ------------------------ --------- ------------------------------ -------------- --------------------------------- ------------------ -------------------- ------ ----------------------------- -------------- ----------------------------- -------------- --------------------------------- ------------------ --------------------------------- ------------------
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60066e21a563576b7b1ece49