React App Rendering Blank but Black

Support
, , ,
1

Hello Everyone,

I’m sorry to say, that I the dredded Netlify blank screen. So I apologize for adding to the tons of blank screen questions.

I am new to Netlify and I switched from GitHub because of the routing issues. I spent a lot of time trying to figure out routing for my React app to no avail. After the switch to Netlify I worked through a lot of things and ended up getting rid of the white blank screen that I initially had. Now after some reworking, its rendering black. I’m not entirely sure, but that makes me feel like I’m on the right track, because my React app is mostly black. I’m thinking it could be an html issue, but it is running completely fine locally.

Also, could you let me know if my routing is correct for Netlify?

https://peaceful-caramel-4fb6dc.netlify.app/

No Error. Building correctly

3:11:49 AM: Netlify Build
3:11:49 AM: ────────────────────────────────────────────────────────────────
3:11:49 AM: ​
3:11:49 AM: ❯ Version
3:11:49 AM: @netlify/build 29.11.5
3:11:49 AM: ​
3:11:49 AM: ❯ Flags
3:11:49 AM: baseRelDir: true
3:11:49 AM: buildId: 646f0a187be7e709e2f2f219
3:11:49 AM: deployId: 646f0a187be7e709e2f2f21b
3:11:49 AM: ​
3:11:49 AM: ❯ Current directory
3:11:49 AM: /opt/build/repo
3:11:49 AM: ​
3:11:49 AM: ❯ Config file
3:11:49 AM: No config file was defined: using default values.
3:11:49 AM: ​
3:11:49 AM: ❯ Context
3:11:49 AM: production
3:11:49 AM: ​
3:11:49 AM: Build command from Netlify app
3:11:49 AM: ────────────────────────────────────────────────────────────────
3:11:49 AM: ​
3:11:49 AM: $ yarn run build
3:11:50 AM: yarn run v1.22.19
3:11:50 AM: $ react-scripts build
3:11:50 AM: Creating an optimized production build…
3:12:01 AM: Compiled successfully.
3:12:01 AM:
3:12:01 AM: File sizes after gzip:
3:12:01 AM: 88.91 kB build/static/js/main.aa94d4b2.js
3:12:01 AM: 30.91 kB build/static/css/main.47a649e1.css
3:12:01 AM: The project was built assuming it is hosted at ./.
3:12:01 AM: You can control this with the homepage field in your package.json.
3:12:01 AM: The build folder is ready to be deployed.
3:12:01 AM: Find out more about deployment here:
3:12:01 AM: Deployment | Create React App
3:12:01 AM: Done in 11.23s.
3:12:01 AM: ​
3:12:01 AM: (build.command completed in 11.3s)
3:12:01 AM: ​
3:12:01 AM: (Netlify Build completed in 11.5s)
3:12:04 AM: Section completed: building
3:12:07 AM: Finished processing build request in 43.05s

net_build_settings
net_build_settings1321×1255 54.2 KB

I appreciate any help and sorry for the redundant post.

P.S.
Netlify Forums won’t let me post more than one image.

2

net_branch_deploy_context
net_branch_deploy_context1327×1254 75.6 KB

3

browser_console_err
browser_console_err3970×2160 346 KB

4

browser_network_err
browser_network_err3970×2160 222 KB

5

Any help at all, please.

6

Remove homepage from your package.json.

7

Hey, so I created and updated the toml file (netlify.toml goes in the root) with the code given to me by Aleksandar over at Stack Overflow

[build]
  command = "npm run build"
  publish = "build/"

[[redirects]]
from = '/*'
to = '/index.html'
status = 200

And I removed the homepage line from my package.json.

Thanks to everyone. huge lifesavers!