A simple webpack plugin that turns environment variables from dotenv into a webpack asset.
Single page applications that try to conform with The Twelve-Factor App typically have the same problem in common: Runtime configuration (e.g. API base URIs) that should not be included in the production build, as these are depending on the environment the application is deployed in. A possible solution to this problem is to have the webserver provide an endpoint such as /env.js that include a JSON object with all relevant runtime configs.
This plugin aims to streamline the development side of that workflow, by creating an /env.js asset from your local .env file, so the application can function the same way as it would in production or other non-local environments. Therefore it is recommended to only use this plugin in your development-specific webpack config.
Include the plugin in your webpack config
const DotenvAssetWebpackPlugin = require('dotenv-asset-webpack-plugin');plugins: [
new DotenvAssetWebpackPlugin(),
]Add the generated env.js to your site
<script src="/env.js"></script>Environment configuration will be available through
window.environmentConfiguration