如何在Yarn Workspaces管理的Monorepo中跨项目共享配置/环境变量？

云上老周

2026-5-20

Absolutely! You totally can share environment variables across your Yarn Workspaces monorepo—whether you’re dealing with CRA apps or pure library packages. Let’s break down the most reliable, practical ways to make this happen:

1. Root-Level Environment Files

Create .env, .env.local, or environment-specific files (like .env.development) at your monorepo root. This centralizes shared config, and you can make subpackages read these files with a few tweaks:

For CRA projects: CRA only reads .env files in the project’s own root by default. Fix this with env-cmd to load root-level variables first. Update your subpackage’s package.json scripts:
```
{
  "scripts": {
    "start": "env-cmd ../../.env react-scripts start",
    "build": "env-cmd ../../.env.production react-scripts build"
  }
}
```
Your subpackage’s own .env variables will override root ones if there’s a name conflict (subpackage takes priority).
For pure library packages: Use the dotenv package to load root variables directly in your code. Add this to your library’s entry file:
```
require('dotenv').config({ path: '../../.env' });
```
Or inject variables via your build script:
```
{
  "scripts": {
    "build": "env-cmd ../../.env tsc"
  }
}
```

2. Shared Config Package

Create a dedicated subpackage (e.g., @yourrepo/shared-config) to act as a single source of truth for all shared variables:

In this package, create a file like env.js to export standardized variables:

// packages/shared-config/env.js
module.exports = {
  API_BASE_URL: process.env.REACT_APP_API_BASE_URL || 'https://default-api.example.com',
  APP_DISPLAY_NAME: process.env.REACT_APP_APP_DISPLAY_NAME || 'My Monorepo App',
  // Add other shared variables here
};

Install this local package in other subpackages:
```
yarn add @yourrepo/shared-config
```

Import and use the variables anywhere:

// In a CRA component
import { API_BASE_URL } from '@yourrepo/shared-config';

// In a library utility file
const { APP_DISPLAY_NAME } = require('@yourrepo/shared-config');

This approach lets you add validation, default values, and type checks for shared variables—no more duplicating config logic across packages.

3. Global Scripts with Injection

Define scripts in your monorepo root’s package.json to inject shared variables when running subpackage scripts:

{
  "scripts": {
    "start:app1": "REACT_APP_SHARED_VAR=global-value yarn workspace @yourrepo/app1 start",
    "build:all": "REACT_APP_API_URL=https://prod-api.example.com yarn workspaces run build"
  }
}

This is perfect for CI/CD pipelines or one-off runs where you need to set global variables without modifying local .env files.

Key Notes

CRA Prefix Requirement: CRA only recognizes variables prefixed with REACT_APP_. If you’re sharing variables with CRA apps, make sure to use this prefix. Pure libraries have no such restriction.
Variable Priority: Script-injected variables > subpackage .env variables > root .env variables. Keep this in mind to avoid unexpected overrides.
Environment Specificity: Use root-level .env.development or .env.production files to tailor configs for different environments, and pair them with env-cmd to load the right file for each script.

内容的提问来源于stack exchange，提问作者hmlee