Can't get runtime env variables anymore on Create-React-App 2.0

[arik-gamerlink]

Hi,

I've recently been using this buildpack. I took note that runtime env variables wouldn't be possible without the "@mars/heroku-js-runtime-env" dependecy. So I installed it and wrote something like;

import runtimeEnv from '@mars/heroku-js-runtime-env'; const env = runtimeEnv(); export const serverUrl = env.REACT_APP_BACKEND_API || 'https://backend-staging.herokuapp.com/';

It worked great for a while, and now I seem to be getting an error;

Runtime env vars cannot be parsed. Content is {{REACT_APP_VARS_AS_JSON_______…

I believe this happened right after upgrading to create-react-app 2.0

[mars]

Hi @arik-gamerlink, create-react-app v2 upgrades to webpack v4, which is probably the cause of this breakage.

We’ll need to investigate where the js-runtime module is now bundled, figure out which build/static/ file contains it. It’s possible to set a custom bundle location, so this might be immediately fixable.

Thanks for reporting! It will probably take me a week to get to this. I’ll add notice to the README shortly.

[arik-gamerlink]

Thanks for the response! I look forward to seeing the new release. Let me know if you need any more information from me.

[cancan101]

It looks like the new builds generate (at least) 2 js files:

<script src="/static/js/1.11474d44.chunk.js"></script>
<script src="/static/js/main.5cbb2a16.chunk.js"></script>

with the REACT_APP_VARS_AS_JSON_______ showing up in the non main one.

[mars]

Given that the bundle is programmatically split, it doesn’t seem we can predict which file might contain the js-runtime-env module.

Perhaps the best permanent solution is to match/glob the static/*.js files and then attempt var replacement in each of them.

[cancan101]

Perhaps the best permanent solution is to match/glob the static/*.js files and then attempt var replacement in each of them.

sounds good to me, at least for now. though maybe someone that knows more about webpack 4 can chime in.

[mars]

Just released v7.0.0, which fixes this issue.

create-react-app 2 split bundles are now supported for runtime env vars.