Blank page after build
As the title says, after
refine build and refine start (preview) I got blank pages. Accessing both defined and undefined routes I still got blank pages.
Inspecting the page, I realized that the body contained nothing. Do you know what's happening?
Those are libs I used:
"@ant-design/icons": "5.3.6",
"@ant-design/plots": "^2.1.16",
"@dnd-kit/core": "^6.1.0",
"@dnd-kit/modifiers": "^7.0.0",
"@dnd-kit/sortable": "^8.0.0",
"@fullcalendar/core": "^6.1.11",
"@fullcalendar/daygrid": "^6.1.11",
"@fullcalendar/list": "^6.1.11",
"@fullcalendar/react": "^6.1.11",
"@fullcalendar/timegrid": "^6.1.11",
"@react-pdf/renderer": "^3.4.2",
"@refinedev/antd": "^5.37.6",
"@refinedev/cli": "^2.16.29",
"@refinedev/core": "^4.49.0",
"@refinedev/devtools": "^1.1.37",
"@refinedev/nestjs-query": "^1.1.3",
"@refinedev/react-router-v6": "^4.5.7",
"@uiw/react-md-editor": "^4.0.4",
"algoliasearch": "^4.23.3",
"antd": "^5.16.2",
"antd-img-crop": "^4.21.0",
"antd-password-input-strength": "^2.0.1",
"axios": "^1.6.8",
"classnames": "^2.5.1",
"dayjs": "^1.11.10",
"graphql-tag": "^2.12.6",
"graphql-ws": "^5.16.0",
"i18next": "^23.11.2",
"leaflet": "^1.9.4",
"lodash": "^4.17.21",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-i18next": "^14.1.0",
"react-instantsearch": "^7.7.1",
"react-leaflet": "^4.2.1",
"react-leaflet-cluster": "^2.1.0",
"react-router-dom": "^6.22.3",
"react-use": "^17.5.0"
2 Replies
Hi @Edward Dao. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:
----------------------
There could be several reasons why you're seeing a blank page after building and starting your Refine application. Here are a few possibilities based on the knowledge sources provided:
1. Routing or Page Creation Issues: If there's an issue with how your pages are created or how your routes are set up, you might end up with a blank page. For example, in the Refine vs RedwoodJS blog post (https://refine.dev/blog/refine-vs-redwood-js#refine-3), it's shown how to create a new page and link it to the
Refine component. If there's a mistake in this process, it could result in a blank page.
2. Errors in the Build Process: As seen in the Discord support thread (https://discord.com/channels/837692625737613362/1164702655835283537), there could be errors during the build process that result in a blank page. In this case, the user was trying to host a Refine app in AWS EC2 and encountered errors related to Vite and CSS files.
3. Issues with Next.js: If you're using Next.js, there could be issues related to that. For example, in the Github issue about the Next.js example app not building/working (https://github.com/refinedev/refine/issues/3385), the user encountered an error related to Next.js and CSS files.
4. Bugs in Refine: There could be bugs in Refine that are causing the blank page. For example, in the Github issue about the NextRouter not being mounted (https://github.com/refinedev/refine/issues/5768), the user encountered a blank page due to a bug in Refine.
To troubleshoot, you could start by checking your console for any error messages. If there are errors, they could provide clues about what's going wrong. You could also try creating a new page and route to see if that resolves the issue. If you're using Next.js, you might want to check for any known issues or bugs related to Next.js and Refine.
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------<@740124840253587486> kapa.ai is still learning and improving, please let us know how it did by reacting below