Environment variable evaluation not working in index.html

Is this a bug report?

yes

Did you try recovering your dependencies?

yes

Environment

System: OS: macOS High Sierra 10.13.6 CPU: x64 Intel® Core™ i5-7360U CPU @ 2.30GHz Binaries: Node: 10.9.0 - /usr/local/bin/node npm: 6.2.0 - /usr/local/bin/npm Browsers: Chrome: 70.0.3538.67 Safari: 12.0 npmPackages: react: ^16.5.2 => 16.5.2 react-dom: ^16.5.2 => 16.5.2 react-scripts: ^2.0.3 => 2.0.5 npmGlobalPackages: create-react-app: Not Found

Steps to Reproduce

1. Add a condition script in your public/index.html file based on an env variable:

<script>
      '%REACT_APP_ENV%' === 'production' ?  console.log('production') : console.log('not production')
</script>

1. Set a value for that env variable at build time: REACT_APP_ENV=production react-scripts build
2. Inspect build/index.html

Expected Behavior

You should see

<script>console.log('production')</script>

Actual Behavior

you see:

<script>console.log('not production')</script>

[jtwebb]

I can’t give a satisfying reason as to why this is happening, but I can give a fix.

<script>
      '%REACT_APP_ENV%'.toString() === 'production' ?  console.log('production') : console.log('not production')
</script>

I’m not sure why we would have to add toString() because if you check the types on both '%REACT_APP_ENV%' and 'production' they’re both strings. And the values are both 'production'. But as soon as I added the toString() it worked as expected.

[andreisocaciu]

console.log('%REACT_APP_LOAD_STUFF%' === 'true') still returns false.