访问官网
Github
文档dotenv-run
dotenv-run是一系列包的集合，使用dotenv来支持从.env文件加载环境变量，并提供多种集成方式。
使用dotenv-run的一些好处包括：
- ✅ Monorepo ✨：支持包含多个应用程序的monorepo项目。
- ✅ 通用性：支持多种集成，包括CLI、Webpack、Rollup、Vite、ESbuild和Angular。
- ✅ TypeScript：支持TS项目，为
process.env和import.meta.env提供类型定义。 - ✅ ESM：支持ESM模块中的
process.env和import.meta.env。 - ✅ 安全性：支持通过前缀过滤环境变量。
集成方式
| 集成方式 | 包名 | 状态 |
|---|---|---|
| CLI | @dotenv-run/cli | ✅ |
| 核心 | @dotenv-run/core | ✅ |
| ESBuild | @dotenv-run/esbuild | ✅ |
| Rollup | @dotenv-run/rollup | ✅ |
| Vite | @dotenv-run/rollup | ✅ |
| Node.js预加载 | @dotenv-run/load | ✅ |
| Angular | @ngx-env/builder | ✅ |
快速开始
假设你有以下monorepo结构：
platform
├── apps
│ ├── vite-app
│ ├── ng-app
│ └── esbuild-app
│ │ ├── .env.local # API_BASE=http://localhost:3001
│ │ ├── package.json
│ │ └── webapp.config.mjs
├── libs
│ └── rollup-lib
│ ├── package.json
│ └── rollup.config.mjs
├── .env.dev # API_BASE=https://dev.dotenv.run
├── .env.prod # API_BASE=https://prod.dotenv.run
├── .env # API_USERS=$API_BASE/api/v1/users;API_AUTH=https://$API_BASE/auth
├── nx.json
└── package.json
以及以下dotenv-run选项：
{
"verbose": true, // 打印调试信息
"unsecure": true, // 显示环境变量值
"root": "../..", // 搜索.env文件的根目录
"environment": "dev", // 要加载的环境（默认：NODE_ENV）
"files": [".env"], // 要加载的.env文件（默认：.env）
"prefix": "^API_" // 用于过滤环境变量的前缀（与打包工具一起使用）
}
dotenv-run将搜索并加载位于根工作空间/home/code/platform到应用程序当前工作目录的.env.*文件。
- 根目录：/home/code/platform
- 工作目录：/codes/code/platform/apps/esbuild-app
- 文件：.env
- 环境：dev
- 环境文件：
✔ /home/code/platform/apps/esbuild-app/.env.local
✔ /home/code/platform/.env.dev
✔ /home/code/platform/.env
- 环境变量：API（不安全模式）
✔ API_USERS http://localhost:3001/api/v1/users
✔ API_AUTH https://localhost:3001/auth
@dotenv-run/cli
@dotenv-run/cli是一个独立的CLI工具，可用于运行脚本。
❯ npx dotenv-run
用法：dotenv-run [选项] -- <命令>
选项：
-v, --verbose [regexp] 显示调试信息
-u, --unsecure 显示环境变量值
-e, --env [environment] 要加载的环境（默认：NODE_ENV）
-r, --root 搜索.env文件的根目录
-f, --file [.env,.secrets] 要加载的.env文件（默认：.env）
-h, --help 输出使用信息
示例：
dotenv-run -d
dotenv-run -- npm start
dotenv-run -r ../.. -f .env,.secrets -- npm start
dotenv-run -f ../.env,../.env.api -- npm start
@dotenv-run/core
@dotenv-run/core是核心包，可用于从.env文件加载环境变量。
env({
root: "../..",
verbose: true,
prefix: "^API_",
files: [".env"],
});
@dotenv-run/esbuild
@dotenv-run/esbuild是esbuild的插件，可用于将环境变量注入到应用程序中。
import { dotenvRun } from "@dotenv-run/esbuild";
await build({
write: false,
bundle: true,
entryPoints: [`test/app.js`],
plugins: [
dotenvRun({
verbose: true,
root: "../../",
prefix: "^API",
}),
],
});
@ngx-env/builder
@ngx-env/builder是Angular CLI的插件，也是@dotenv-run/esbuild或@dotenv-run/webpack的包装器，可用于将环境变量注入到Angular应用程序中。
- ✅ dotenv文档中的官方推荐 🔥
- ✅ 运行时环境变量（实验性） 🎉
- ✅ 支持Webpack和ESBuild 🚀
- ✅ 易于使用，无需配置
- ✅ 与最新的Angular版本保持同步
- ✅ 支持所有Angular CLI命令
- ✅ 被流行的仓库使用
- ✅ 积极开发和支持
演示
快速开始
ng add @ngx-env/builder
环境变量应以NG_APP_前缀开头，你可以定义自定义前缀。
NG_APP_VERSION=$npm_package_version
NG_APP_COMMIT=$GITHUB_SHA
NG_APP_ENABLE_SENTRY=false
@Component({
selector: "app-footer",
template: `{{ branch }} - {{ commit }}`,
standalone: true,
})
export class MainComponent {
branch = import.meta.env.NG_APP_BRANCH_NAME; // 推荐
commit = process.env.NG_APP_COMMIT; // 已废弃
}
<!-- index.html -->
<head>
<title>NgApp on %NG_APP_BRANCH_NAME% - %NG_APP_COMMIT%</title>
</head>
可以在angular.json文件的ngxEnv部分传递配置选项给@ngx-env/builder。
{
"builder": "@ngx-env/builder:application",
"options": {
"ngxEnv": {
"verbose": true,
"root": "../..",
"prefix": "^NG_APP_"
}
}
}
如果你想在运行时更新环境变量，可以使用runtime选项。
你可以在这里找到完整的@ngx-env/builder文档。
@dotenv-run/webpack
@dotenv-run/webpack是webpack的插件，可用于将环境变量注入到应用程序中。
import { DotenvRunPlugin } from "@dotenv-run/webpack";
import path from "path";
const __dirname = path.resolve();
export default {
entry: "./src/index.js",
output: {
filename: "main.js",
path: path.resolve(__dirname, "dist"),
},
plugins: [
new DotenvRunPlugin(
{ prefix: "^API", verbose: true, root: "../.." },
__dirname
),
],
};
@dotenv-run/rollup
@dotenv-run/rollup是rollup的插件，可用于将环境变量注入到应用程序中。
import env from "@dotenv-run/rollup";
export default {
input: "src/index.js",
output: {
file: "dist/index.js",
},
plugins: [env({ prefix: "API", verbose: true, root: "../../.." })],
};
致谢
许可证
MIT © Chihab Otmani
