Hi, @LauraLee. I split this question to a new topic because the issue in this case is different.
The error in the logs is this:
7:42:30 AM: Failed to compile.
7:42:30 AM:
7:42:30 AM: ./src/components/Country.js
7:42:30 AM: Cannot find file '../data/clientInfo.js' in './src/components'.
7:42:30 AM: npm ERR! code ELIFECYCLE
7:42:30 AM: npm ERR! errno 1
7:42:30 AM: npm ERR! covid-react@0.1.0 build: `react-scripts build`
7:42:30 AM: npm ERR! Exit status 1
7:42:30 AM: npm ERR!
7:42:30 AM: npm ERR! Failed at the covid-react@0.1.0 build script.
7:42:30 AM: npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
7:42:30 AM: npm ERR! A complete log of this run can be found in:
7:42:30 AM: npm ERR! /opt/buildhome/.npm/_logs/2020-10-18T14_42_30_958Z-debug.log
The logs are public as is the repository URL so I took a look at the file referenced here:
This references a file of ../data/clientInfo.js. However, there is no such file at that path:
Thank you Perry. I created the .env file and moved the api there.
It deployed, but doesn’t work. Its failing where the code grabs the API data.
I have console.log in the app.js the process.env to console out the name of the variable in .env, its returns as undefined in console.
I created the app with create-react-app, and have the variable name in .env appended with REACT_APP_.
EDIT: I see where I went wrong, I’m struggling a bit to add the correct information to then rebuild.
I didn’t add environment variables to the Environment section for netlify build.
Where it says to
Set environment variables for your build script and add-ons
Then to add the key and value, the key I would think would be the variable name, but I’m not following what the value should be…certainly its not the api key itself that I’m keeping hidden.
Going through the docs to try to grasp the steps needed. Any guidance would be appreciated.
Hi, @LauraLee. There is no way (that I know of) to protect secrets in client side javascript. The solution for this is typically to make the required API calls via Functions and store the private API keys in that environment.