Whenever I deploy a firebase project and go to the url, it shows me a blank page. Earlier (last year) when I used to deploy they used to work fine. They all run fine locally and even with the build folder (create-react-app) and dist folder (vite) when ran using local server they work fine. But the deployed links just show the blank page.
The developer console shows the following errors –
(https://i.sstatic.net/A2HseqV8.png)
I checked multiple times and the public folder in firebase.json is set correctly to build (create-react-app) or dist (vite)
{
"hosting": {
"public": "dist",
"ignore": [
"firebase.json",
"**/.*",
"**/node_modules/**"
],
"rewrites": [
{
"source": "**",
"destination": "/index.html"
}
]
}
}
2
Answers
firebaser here
You may want to look at the version of
firebase-tools
that you are using. We found an issue in13.11.3
(and.4
) that caused some files to not be discovered correctly when deploying to Firebase Hosting.13.12.0
– released today – should address that issue.If you’re still seeing the issue, let us know, or file an issue in the firebase-tools repository (and reference this post)
in your dev console it states that your import of the .css file has an incorrect type
Try changing the type=“text/html” to type=“text/css”
Also I had the issue when deploying on hostinger my vite.js file had a base:”/project-name/“
I removed that and it fixed the directive path for the files.