# webpack-cra-runtime-config

> Webpack plugin for generate config from .env file, replaceable by server runtime.

Latest version **1.0.7** (published 2020-10-27) · MIT license · 0 weekly downloads

## Install

```sh
npm install webpack-cra-runtime-config
pnpm add webpack-cra-runtime-config
yarn add webpack-cra-runtime-config
bun add webpack-cra-runtime-config
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.7 |
| Published | 2020-10-27 |
| First published | 2020-10-22 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 8.5 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | Web7 |
| Maintainers | evgheni |
| Keywords | react, runtime, config, cra |

## Links

- npm: https://www.npmjs.com/package/webpack-cra-runtime-config
- Repository: https://github.com/web-seven/webpack-cra-runtime-config
- Homepage: https://github.com/web-seven/webpack-cra-runtime-config#readme
- Issues: https://github.com/web-seven/webpack-cra-runtime-config/issues
- npm.io page: https://npm.io/package/webpack-cra-runtime-config

## Alternatives

- [mobx-react](https://npm.io/package/mobx-react.md) — 2.8M weekly downloads
- [rc-tree](https://npm.io/package/rc-tree.md) — 2.6M weekly downloads
- [@react-oauth/google](https://npm.io/package/@react-oauth/google.md) — 1.3M weekly downloads
- [@wagmi/connectors](https://npm.io/package/@wagmi/connectors.md) — 877.0K weekly downloads
- [vee-validate](https://npm.io/package/vee-validate.md) — 836.4K weekly downloads

## Recent versions

- 1.0.7 (latest) — 2020-10-27
- 1.0.6 — 2020-10-23
- 1.0.5 — 2020-10-23
- 1.0.4 — 2020-10-23
- 1.0.3 — 2020-10-23
- 1.0.2 — 2020-10-23
- 1.0.1 — 2020-10-22
- 1.0.0-beta — 2020-10-22
- 1.0.0-alpha — 2020-10-22

## README

<div align="center">
  <a href="https://github.com/webpack/webpack">
    <img width="200" height="200"
      src="https://webpack.js.org/assets/icon-square-big.svg">
  </a>
</div>

# webpack-cra-runtime-plugin
With this plugin you could still use `process.env` object in your production built application.
Used `process.env.EVN_VAR` values not replaced in production build, but keep clean `process.env` object.
For runtime configuration update, plugin generate configuration chunk `.dist` file with configuration values placeholders, which could be replaced on server side at runtime.

## Getting Started

To begin, you'll need to install `webpack-cra-runtime-plugin`:

```console
$ npm install webpack-cra-runtime-plugin --save-dev
```

Then add the plugin to your `react-app-rewired` config. For example:

**config-overrides.js**

```js
const { override } = require('customize-cra');
const webpack = require('webpack');
const CraRuntimeConfigPlugin = require('webpack-cra-runtime-plugin');

function overrides(config, env) {
    config.plugins.push(new CraRuntimeConfigPlugin(config))
    return config;
}

module.exports = {
    webpack: override(
        overrides,
    ),
}
```
Next just call generated helper script `build/entrypoint.sh`, which will update `REACT_` configuration values from environment variables in configuration module. 
This is very useful when you use Docker containers, where posible just to call `entrypoint.sh` in ENTRYPOINT.

**Dockerfile**
```bash
COPY ./build/entrypoint.sh /working-directory/entrypoint.sh
RUN chmod -x /working-directory/entrypoint.sh
ENTRYPOINT ['/working-directory/entrypoint.sh']
```

## License

[MIT](./LICENSE)

---
_Source: https://npm.io/package/webpack-cra-runtime-config · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._