Hi Vinod, I would need a link to said Netlify Build logs. My repo builds fine and continues to work with the aKey just being set to the newsapi key they give you.
I had not got time to run the code locally, however, it does build for netlify.
I will try to give it a quick local review this evening, however I cannot guarantee anything quick thank you!!
Next generates static pages, and the next-on-netlify plugin uses functions.
Clone my repo, set the API_KEY in the UI to JUST the api key not “apiKey=xzxzc” as you said before.
You cannot console log the environment variable but it is built into the api call so that you will be authorised when it is called on page load. As you can see from https://pedantic-haibt-214364.netlify.app/ I did not hardcode the value either.
Because its injected at build time you wont see the api call in the network tab (maybe) as it will just be the javascript running, I am replying without looking at the code just recalling from memory.
For me to view your builds on netlify youd need to give me a link to them, it would also be helpful if you linked your published site
{“errorType”:“Runtime.UnhandledPromiseRejection”,“errorMessage”:“TypeError: Cannot read property ‘map’ of undefined”,“trace”:[“Runtime.UnhandledPromiseRejection: TypeError: Cannot read property ‘map’ of undefined”," at process. (/var/runtime/index.js:35:15)“,” at process.emit (events.js:314:20)“,” at processPromiseRejections (internal/process/promises.js:209:33)“,” at processTicksAndRejections (internal/process/task_queues.js:98:32)"]}
Did you try to clone my repo and set your API_KEY in the ui? I have successfully done what you are trying to achieve. Accessing the Environment variable at BUILD time so that api requests can be successfully made.
I understand your issue and am trying to state that I cloned your repo, tested its workings, and submitted a PR for you.
Lets say for whatever reason your data doesn’t come back then undefined.map will cause the error youre getting, there is no harm in fixing that so see where you get to next?
Lets get it working on netlifies build and dig deeper into the local environment after?
I was going to fork your repo again just to check any changes you had made since opening the issue but that would most likely override my current PR and I wanted you to still be able to access it
To clarify, you are trying to access your environment variable at BUILD time in netlify, setting the API_KEY in the UI and that will be built into your generated site so that it can pull data from the third party. You will not be able to console log the variables or use them at run-time so therefore if you try to run it locally at this current time, the variable will be undefined.
Your error posted above clearly states Cannot read property ‘map’ of undefined”,. Changing both uses of data to fallback to an empty array when undefined will at least let you see the next issue if there is one. I know it is not related to accessing your variable.
Why did you need an env file? Lets attempt to get your code built in netlify first. Did you:
clone the repo,
create a netlify site with your API_KEY environment variable set.
deploy your changes so that it triggers a build with the newly set variable?
I am off to bed in as second but will try to wait if you are willing to attempt this
EDIT: I just checked as I am getting off now, from my repo I added a .env at the root directory with API_KEY="abcMYKEYHEREASDasdada" and then ran yarn dev and everything seemed to run fine locally too!
I hope this manages to help you as I think we are in different timezones One last suggestion, which would also be included in the above steps is that somehow someway maybe your current site setup has other issues to creating the site again with this new configuration will have better luck. Goodluck! Ill check back when I can tomorrow for you.
In your netlify UI you’ve entered your API key inside quotes such as “123422” but you don’t need the quotes the UI handles that for you so the API is thinking you’ve entered the wrong API key.
Remove the quotes surrounding your API key in the UI and then edit a file add a comment etc to the code and commit it. You must do this to trigger a proper rebuild and redeployment with the new environment variable
No worries remember you might need to edit the code and commit and push to GitHub to change the checksum and use the new variable.
I also recommend removing the process printing from your command now and making your deploys private OR generate a new news API key if you’re super sensitive that I have seen the key. Thanks and hope it’s sorted haha I’m literally laying in bed typing on my phone