Replace dotenv-webpack with universal-dotenv

[swernerx]

Bug Report

Where CRA supports multiple dot env files for quite some time:
facebook/create-react-app#1343

Storybook pretty recently added support for dot env, but only for one file. This introduces the following issue: Even when adding manual dot env processing, the variables from Dotenv-Webpack are already defined (The plugin parses DotEnv files automatically when being initialized). There is the convention that DotEnv is never overriding anything - mainly because of supporting command line shell variables.

Steps to reproduce

Adding both a .env and .env.local the latter one is ignored completely.

Please specify which version of Storybook and optionally any affected addons that you're running

• @storybook/react": "^4.0.0-alpha.4"

Affected platforms

• All

Description

The following this does not work correctly:

.env:

API_SERVER = https://api.myservice.com/v1

.env.local:

API_SERVER = http://localhost:4000/

The issue is that the public API is already set before my app code - even when using a fully customized Webpack config is able to tweak it.

As CRA committed to use the multiple .env files, I feel that it's a good idea to do the same.

Easiest possible approach seems to be:

Replace this entry in the plugin list:

import Dotenv from 'dotenv-webpack';
new Dotenv({ silent: true }),

with

import { getEnvironment } from "universal-dotenv"
new webpack.DefinePlugin(getEnvironment().webpack)

This should align dot env handling with CRA. It also automatically passes all APP_* settings to the application without requiring any safe .example files.

Acceptance criteria

Should parse .env.local before parsing .env.

Who to contact

Me :)

[stale]

Hi everyone! Seems like there hasn't been much going on in this issue lately. If there are still questions, comments, or bugs, please feel free to continue the discussion. Unfortunately, we don't have time to get to every issue. We are always open to contributions so please send us a pull request if you would like to help. Inactive issues will be closed after 30 days. Thanks!

[swernerx]

The PR is in progress. #3744

[swernerx]

Fixed by #3744