I have just started using netlify and its been giving me a 404 not found page.Apparently the link is broken. I looked on the Netlify Community and they said that there was no index.html present. This isn't true BEFORE the deploy but after, it disappears. I've been trying to solve the problem but with no avail. Please could someone help?Picture of before deploy
It looks like you need to update some of Netlify's Build Settings - see docs here: https://docs.netlify.com/configure-builds/get-started/
It looks like you're using react-scripts, so the Build command on Netlify should be yarn build and the Publish directory should be build.
Update: If you are using Netlify's drag and drop functionality instead of its build & deploy pipeline, you need to make sure that the folder you are dragging is the one named build, so the index.html is at the root of the site.
Easy fix;
In your root directory, create a _redirects file;
Add this;
/* /index.html 200
This should fix the issue for React apps hosted on Netlify.
Source: https://devsntechies.com/fix-page-not-found-error-on-netlify-app/
Related
I was trying to deploy my MERN based E-commerce website on render.com, after the render terminal shows the build was successful the the webpage shows the error as,
{“message”:“ENOENT: no such file or directory, stat ‘/opt/render/project/src/frontend/build/index.html’”,“stack”:null}
I’m a complete beginner to render and MERN too,
I have no bulid folder in my local
then I tried to create another test app by npx create-react-app test to check if build folder is actually present in there or not, But it is not there, I’m totally in Confused now…
I’m Giving my repo here → stunning spark
I just want to have clear answers for my questions(Please!!!)
Things I want to change in my directory to deploy and host my app Successfully.
Things Need to be configured in the render’s settings
Thanks in Advance!!!
I just want to deploy and host my application on render.com
Just run npm run build into your frontend folder and do check you have removed the "build" keyword from the .gitignore file because it won't let you push the build folder to GitHub and you are good to go.
We have a node web project hosted off of Heroku that contains a library hosted on GitHub. We often make changes to the GitHub library.
When we push the updated node web project to Heroku for deployment, it doesn't check if the library on GitHub has been updated.
We're wondering if there is a command that clears the cache/node_modules folder on Heroku to resolve this?
Cheers,
Peter
I found the solution after searching for a while. You have to disable the cache via config and also purge the existing one for old builds. Also I recommend deleting the package-lock.json to clear any issues.
https://devcenter.heroku.com/articles/nodejs-support#cache-behavior
https://help.heroku.com/18PI5RSY/how-do-i-clear-the-build-cache
I've deployed sites on Netlify before so I know how to use the website. The only difference is that those sites were created via React.js. The website I'm trying to deploy is an old project of mine but I didn't use React at the time so it couldn't be opened using "npm start" "npm build" etc.
So how do you deploy a site that doesn't use React into Netlify? I tried looking for answers online but I couldn't find the specific answer that relates to mine.
Netlify has nothing to do with React, it can build and host many different types of site with various frameworks.
When configuring your Netlify site, you can set the following options:
Base directory: Optional field to set the directory that the buildbot changes to before starting a build. If not set, the base directory defaults to the root of the repository.
Build command: If you are using a static site generator or other build tool, this is where you should specify the command to run to build your site. For example, npm run build.
Publish directory: Directory that contains the deploy-ready HTML files and assets, either generated by the build step or pre-built.
I have a repo that has the backend and frontend (create-react-app) in two separate folders. For the build command, I have something like cd frontend && npm run build and for the publish directory, I have something like frontend/build, but this is not working.
disclaimer: I work for Netlify.
If you were to clone a new copy (no node modules installed in the project, for instance) of your project on a fresh laptop with nothing else except node and npm installed there, how would you build it? Imagine netlify's build process like that. So you're missing at least an "npm install" step in there :)
Anything else missing, like globally installed npm packages? Need to specify them in package.json so that Netlify's build network knows to grab them for you. Ruby gems? Better have a Gemfile in your repo!
Netlify tries to npm install (and bundle install) automatically for you, assuming there is a package.json either in the root of your repository (I'm guessing yours is in frontend/ ?) OR if you set the "base" parameter so that we start our build in the base directory. This is probably a good pattern for you, to set "base" to frontend, and then set your publish directory to build.
You can specify that base parameter in netlify.toml something like this:
[build]
base = "frontend"
Note that netlify.toml must reside in the root of your repository.
For more details on how Netlify builds, check out the following articles:
Overview of how our build network works. This article also shows how you can download our build image to test locally.
Settings that affect our build environment. Useful for telling us about what node version to use, for instance.
Some frequently experienced problems
If after some reading and experimenting, you still can't figure things out, ping the helpdesk.
The top answer is correct ^. For anyone looking to simply change the base directory (lets say there is only one npm install/start) you need to change the BASE DIRECTORY, which you will find in the build settings. Simply go to: site-settings -> build & deploy - and you will see it where I pointed in the picture attacted. Hopefully that helps someone in need of this. see here
I am trying to get my localhost server on Firebase to work but I am continuing to get the following message in the browser 'Cannot GET /'. I took a look in the console and all it says is 'http://localhost:5000/ 404 (Not Found)'.
I have tried re-running the server using 'firebase serve' and that doesn't help.
I ran 'firebase init' again and that didn't help either.
I re-installed the firebase tools by running 'npm install -g firebase-tools' and then running firebase serve again and still nothing.
Not sure whats going on because it was initially working. I installed some grunt plugins and moved my index.html file under an html folder although I still have an index.html file under the public folder it still says 'Cannot GET /'
I have also tried in different browsers restarting them etc.
I am using a Mac OS X El Capitan.
Let me know if you need any more info. Thanks in advance
I had this issue running firebase serve from within the scripts directory in the "Friendly Chat" tutorial. Starting the server from the parent directory got it working again as expected.
if this will help someone save time.. a possibility: it could be that the build step did not complete, this was my case, and the build/... directory had no index.html
I had the same issue when was trying to serve an Angular application with the firebase command.
Firstly, you should see the firebase.json file.
It should contain the "public" value, like:
{
"public":"dist/ProjectName"
...
}
But the dist folder will be auto created only after you build the Angular project:
ng build --prod
After you can do the:
firebase serve
Hope it will be helpful for beginners.
Ok so got this working but pretty much had to start from scratch again. I deleted the public folder and just moved my html, css, js, and node-module folders out of my project directory and then re-installed firebase-tools and ran the 'firebase init' command and then restarted the localhost server and everything started working again. After which point I moved back all my previous folders and things are working as before.
Not a 100% sure how the issue happened but at one point I did delete my index.html file and then put it back in later on as I was testing something. At which point I feel the issue started. I will try to test this scenario in a test project but I guess for the time being don't delete your index.html file just modify the existing one. Thanks all.
The error message shows up if you run 'firebase serve' within the project folder.
Navigate to the parent folder (up one level) using 'cd ..' and start the server from there.
Please check if content of your website is present in folder
"hosting": {
"public": "<folder with your website files>",
from your config "firebase.json"
If you like me, before overthinking the problem, make sure you provided the correct URL to index.html.
In my case, I didn't take into account different structure of my directory. You should provide the path to index.html relative to the root directory of your firebase project. For example, in my case, the correct URL was http://localhost:5000/button-component/public/