I have tried, but cannot replicate this.
Regardless of the mode (production or development) and regardless of sourcemap generation (true or false I always see the values of the variable, and not the variable name, is the resulting built code.
I’m currrently trying to build a new project bit by bit and see at what stage it fails (I’m hoping not right at the beginning). Will post anything I find here.
I am curious about the sections in main.XXX.chunk.js such as
S = Object({
NODE_ENV: 'production',
PUBLIC_URL: '',
WDS_SOCKET_HOST: void 0,
WDS_SOCKET_PATH: void 0,
WDS_SOCKET_PORT: void 0,
FAST_REFRESH: !0
}).REACT_APP_API_BASE_URL;
and
ft = Object(gt.a) (Object({
NODE_ENV: 'production',
PUBLIC_URL: '',
WDS_SOCKET_HOST: void 0,
WDS_SOCKET_PATH: void 0,
WDS_SOCKET_PORT: void 0,
FAST_REFRESH: !0
}).REACT_APP_STRIPE_PUBLISHABLE_KEY),
and the source code that has created these.
Perhaps this issue, or this thread might hold some insights (or even this issue.)
Ok so I had some time to strip the project back.
- I created a new Create-React-App project with the same CircleCI config.yml
- Added just 1 environment variable in the Netlify UI
- Created a new Netlify Site, Github project and new CircleCI project so it is completely detached from previous project.
I have discoved that the problem is likely related to the CircleCI steps in my CI/CD pipeline.
When I push code from git, I forgot to turn off the automatic deploy from Github so it deployed the site twice:
The first deploy preview logs the Netlify env variable correctly
The second deploy preview logs the Netlify env variable as undefined - I believe this is the deploy built using the CircleCI pipeline.
So my question turns to is there anything inside these CircleCI steps that looks wrong?
steps:
- checkout
- run:
name: Install Dependencies
command: yarn install
- run:
name: Build Dev
command: CI=false yarn run build
- run:
name: Install Netlify
command: sudo yarn global add netlify-cli
- run:
name: Netlify Deploy
command: |
netlify deploy --site $NETLIFY_DEV_SITE_ID --auth $NETLIFY_ACCESS_TOKEN --prod --dir=build
I will continue investigating this but hopefully this added information is helpful.
Great work narrowing things down.
While I don’t know/use CircleCI, looking at the workflow from the point of view of something I might do manually, I see an issue I believe.
It appears the build is happening inside CircleCI, then the built files are deployed to Netlify. So unless the REACT_APP_XXX variables are set in CircleCI they are going to take undefined in the built code as the values are injected at build time not deploy time. This is the same as running yarn build (npm run build) locally then deploying to Netlify (whichever way you choose) and not having the environment variables defined locally when building.
If you are using Netlify CLI to build and deploy and have it linked to a Netlify site, the CLI will pull the environment variables defined in the UI while building.
Edit:
I tested this by first running netlify build with a linked project, then netlify build -o (-o is offline). The resulting code looks like that I previously observed in your deploy and is observable in the last test deploys you made:
netlify build
Object(o.jsx)("div", {
hidden: !0,
children: "This is a secret variable"
})
netlify build -o
Object(s.jsx)("div", {
hidden: !0,
children: Object({
NODE_ENV: "production",
PUBLIC_URL: "",
WDS_SOCKET_HOST: void 0,
WDS_SOCKET_PATH: void 0,
WDS_SOCKET_PORT: void 0,
FAST_REFRESH: !0
}).REACT_APP_SECRET_VAR
})
Ah that is interesting, thanks for testing it out. I actually ended up going a slightly different route to bring the build away from circleci. My circleci config is now like this:
- run: npm install
- run:
name: Deploy
command: curl -X POST -d {} $NETLIFY_BUILD_HOOK
Obviously much shorter and also saves a lot of build minutes.
Most importantly however I can now see the environment variables 
so I call that a win for sure.
However, another problem has weirdly arisen.
The deploy preview url in Netlify is showing the correct new build but the new deploy isnt displaying in my netlify.app url for my site or the domain I have set up with my site.
I have tried to fix this all day but no idea why. Any help with this last bit?
When I’ve used a build hook, exactly as you have in the workflow above, always results in the build auto-publishing (at least on the production branch; this may differ on a non-production branch though I have not tested this.)
Oh yeah I set the production branch to a random name to avoid double deploys from GitHub and my circle I pipeline. Any other options here?
So the latest build, as triggered by the webhook, does not have Published next to it in the deploys list?
The build hook is triggering the production branch?
No it does not have published next to it 
Well the deploy preview is showing the correct stuff so I assume the build hook is deploying correctly
From this comment here Triggering publish with a webhook - #3 by FDX
It would suggest that auto publish doesn’t work if you set a different branch (I’ve set the production branch to one I’ll never use to avoid deploying twice - once from GitHub and a second from the webhook)
The thread also seems to suggest another solution possibly? Not sure if you know of this other solution?
Do note the definitions for deploys. A deploy preview as triggered by a PR/merge, takes the form deploy-preview-42--yoursitename.netlify.app as opposed to a production deploy preview which takes the form 61bca6635ddd093d3d0993e2--vigorous-lewin-937bb3.netlify.app (deploy previews have a permalink like this too.)
If it is a deploy preview, you’ll find this thread useful
Any idea what they are referring to as a solution here? Will this work for auto publishing for me too?
I’m not aware of what is referred to there.
Are you using the build hook found under https://app.netlify.com/sites/YOUR_SITE_NAME/settings/deploys#build-hooks or the createSiteBuild API?
Using the former is what I have referenced previously.
Yep I’m using the build hook not the create site build api
Is there anyone else who might know whats causing this to no auto publish?
That’s exactly the cause. Even your screenshot says it:
Deploys from no-deploys are published automatically
So pushes to the master branch are considered as branch deploys:
So this is working as expected. If you don’t want Netlify to build for your commits, you can set [skip netlify] anywhere in your commit message and Netlify will not build for it.