# @common-stack/env-list-loader

> List environment

Latest version **9.0.6-alpha.1** (published 2026-06-08) · UNLICENSED license · 0 weekly downloads

## Install

```sh
npm install @common-stack/env-list-loader
pnpm add @common-stack/env-list-loader
yarn add @common-stack/env-list-loader
bun add @common-stack/env-list-loader
```

## Health

**Score 70/100 (B)** — status: active.

Positive: has types; esm support; no vulnerabilities; recently updated; high maintenance score; high quality score.

Warnings: low downloads.

## Facts

| | |
|---|---|
| Version | 9.0.6-alpha.1 |
| Published | 2026-06-08 |
| First published | 2022-12-21 |
| Weekly downloads | 0 |
| License | UNLICENSED |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 1 |
| Unpacked size | 47.5 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | CDMBase LLC |
| Maintainers | common-stack |

## Links

- npm: https://www.npmjs.com/package/@common-stack/env-list-loader
- npm.io page: https://npm.io/package/@common-stack/env-list-loader

## Dependencies (1)

- [strip-comments](https://npm.io/package/strip-comments.md) ^2.0.1

## Recent versions

- 9.0.6-alpha.1 (latest) — 2026-06-08
- 9.0.6-alpha.0 — 2026-06-08
- 10.0.1-alpha.0 — 2026-06-04
- 9.0.5-alpha.0 — 2026-06-04
- 9.0.4-alpha.0 — 2026-05-26
- 9.0.2-alpha.24 — 2026-05-22
- 9.0.2-alpha.22 — 2026-05-21
- 9.0.2-alpha.13 — 2026-05-11
- 9.0.2-alpha.7 — 2026-05-03
- 9.0.2-alpha.6 — 2026-05-03
- 9.0.2-alpha.1 — 2026-04-26
- 8.6.1-alpha.28 — 2026-04-13
- 8.6.1-alpha.21 — 2026-04-12
- 8.6.1-alpha.13 — 2026-03-25
- 9.0.1-alpha.1 — 2026-03-22
- … 96 more at https://npm.io/package/@common-stack/env-list-loader/versions

## README

# Webpack loader to list the environment variables

## Introduction

It list out all the environment variables which are required in the node environment.
If `publicEnv` exists for web or mobile, it will list out all the variables that are missing in `public-config.ts` file as well as any unused keys. This applies to only `web` and `mobile` webpack bundle.

## Install

```sh
npm install @common-stack/env-list-loader
```

Have the env-config.js file under `config` folder like below

```javascript
# packages-modules/account-api/server/src/config/env-config.ts (example)
# name of the file need to be `env-config.ts`
# it has to be a cleanEnv function or process.cleanEnv function call

export const config = cleanEnv(
    process.env,
    {
        MAIL_SEND_DEFAULT_EMAIL: str(),
        TEAM_INVITATION_TOKEN_SECRET: str({ devDefault: 'xxxxxx' }),
        INVITATION_TOKEN_SECRET: str({ devDefault: 'xxxxx' }),
        NAMESPACE: str({ default: 'default' }),
    },
)
```

If it is web, have the `public-config.ts` file under `config` folder like below

```javascript
# name `const publicEnv =` need to be exact.
# Its value can be string, array, object
const publicEnv = ['NODE_ENV', 'GRAPHQL_URL', 'FACEBOOK_APP_ID', 'GA_ID', 'LOG_LEVEL'];
```

## Webpack Usage

In webpack config add as follows

```javascript
const EnvListPlugin = require('@common-stack/env-list-loader');

module.exports = {
  // ...
  module: {
    rules: [
            {
                // searches for files ends with <dir>/config/env-config.js or <dir>/config/public-config.js
                test: /config\/(env-config|public-config)\.(j|t)s/,
                use: {
                    loader: '@common-stack/env-list-loader',
                },
            },
      // ...
    ],
  },
    plugins: [
      // The plugin lists the environment that required as well recommendation about the keys used.
      new EnvListPlugin.Plugin(),
    ],
  }
}
```

## Vite Usage

In your Vite config file, add the plugin as follows:

```javascript
import { defineConfig } from 'vite';
import envListPlugin from '@common-stack/env-list-loader/vite';

export default defineConfig({
    plugins: [
        envListPlugin({
            // Optional: Add a processor to handle environment variables
            processor: (env) => {
                // Custom processing of environment variables
                console.log('Environment variables:', env);
            },
        }),
    ],
});
```

The Vite plugin will:

1. Scan your `env-config.ts` and `public-config.ts` files
2. Extract environment variables from `cleanEnv` calls and `publicEnv` arrays
3. Print a report of missing and unused environment variables during build
4. Validate environment variables against your configuration

## Output Example

In webpack/vite log will see below

```
missed keys found
[
  'APP_URL',
  'CALLBACK_REDIRECT_URL',
  'POPUP_REDIRECT_URL',
  'DEFAULT_EXTENDED_RENEWAL_TIME',
  'WEB_APP_URL',
  'LOGOUT_REDIRECT_PATH',
  'LOGIN_REDIRECT_PATH'
]
unused keys found
[
  'NODE_ENV',
  'GRAPHQL_SUBSCRIPTION_URL',
  'FACEBOOK_APP_ID',
  'GA_ID',
  'ROUTER_HISTORY',
  'LOG_LEVEL',
  'CDE_WORKSPACE_DOMAIN',
  'CDE_WORKSPACE_URL_PRFIX',
  'ZIPKIN_URL',
  'EXTENSION_SOCKET_URL'
]
required env to set
[
  'CLIENT_URL',
  'AUTH0_CLIENT_ID',
  'AUTH0_DOMAIN',
  'AUTH0_API_AUDIENCE',
  'STRIPE_PUBLISHABLE_KEY'
]
```

Based on the above information, we can cross check if our environment file have the required environment variables.

In browser, we can update the `const publicEnv` value to include all `missed keys found` and remove `unused keys found`

## Babel support

We support above functionality as a babel plugin as well
In babel config add as follows

```javascript
{
    test: /config\/(env-config|public-config)\.(j|t)s/,
    exclude: /node_modules/,
    use: {
        // Converts source file to ast tree
        loader: 'babel-loader',
        options: {
            presets: ['@babel/preset-env', '@babel/preset-typescript'],
            // Expects an ast tree
            plugins: ['@common-stack/env-list-loader/lib/envLogger.js'],
        },
    },
},
```

references: https://github.com/crystal-ball/svg-symbol-sprite-loader

---
_Source: https://npm.io/package/@common-stack/env-list-loader · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._
