I have reactjs app, it's my first time that want to deploy/build my app, I know it's simply can do:
npm run build
I used this on a very simple react app before, it work fine, but now I want to deploy my react app that use react-router-dom, after I run npm run build, index.html is blank, it's okay maybe, because I don't have a route for home page, for example one of my page in develop mode:
<Switch>
...
<Route exact path='/User/Login' component={Login}></Route>
...
</Switch>
/User/Login
How can I access this page after deploy? I am super newbie to reactjs, I don't know how to handle this, many search, but can't find anything useful in my native language.
Packages.json
"name": "sample",
"homepage": "http://example.com/react/",
"version": "0.1.0",
"private": true,
React App needs a node server to be hosted.
If you want to host on linux/Ubuntu server then you will need to install node.js from NVMFull Tutorial or you can go for Gatsby to create static react apps.
You can host your react app on AWS/Heroku etc.
If you are deploying react build for learning purpose only then you can use static server locally:
npm i serve -g
serve -s build
Related
The react app is not building using the homepage tag in package.json file . "homepage":"https://entrepreneurcell.com" . After running npm run build , this is what I am getting in console :-
The project was built assuming it is hosted at /.
You can control this with the homepage field in your package.json.
Please tell me a more efficient way of deploying react app on hostinger or highlight the mistake that i am doing.
How can one deploy a create react app to gh-pages?
My packages.json folder has my homepage listed exactly as this: "homepage": "https://mgcraig78.github.io/RoboFriends",
However, the app will not deploy to gh-pages, and when I enter npm run build, the terminal tells me this (which I'm assuming is the issue, but I can't figure out how to fix it): The project was built assuming it is hosted at /RoboFriends/. <- this obviously is not the homepage I have entered into my packages.json file.
Remove the /RoboFriends from your homepage link in package.json to:
"homepage": "https://mgcraig78.github.io"
Then run
npm run build
What you deploy to github is what's inside the build folder that contains index.html
I have an issue where I deploy my React app the images are not showing. Works fine locally. I've set the homepage to a GitHub site http://ryandixon555.github.io/react-board-game and run
npm build
then
npm deploy
but still no images. I've also specified the homepage in the package.json:
"homepage": "http://ryandixon555.github.io/react-board-game"
In the end I gave up and deployed using netlify, following this link and then copying my code over.
I've got a problem with deploying my react app with gh-pages. I tried all guides from YT and those from the first site of Google. And my GitHub pages don't show an app still. link to my repo:
https://github.com/maksymilianMroz/react-todo-app
the question is Where is the problem? I didnt write smth in the code? How can I fix this? (I want to live preview on my react app by ghpages)
When you open your project site https://maksymilianmroz.github.io/react-todo-app/ and do a full refresh with the developer tools of your browser enabled, you will see that all javascript and css references result in a 404. This is because all url all prefixed with maksymilianMroz.
eg https://maksymilianmroz.github.io/maksymilianMroz/react-todo-app/static/css/main.fbf7fb8c.chunk.css
where it should be https://maksymilianmroz.github.io/react-todo-app/static/css/main.fbf7fb8c.chunk.css
This is caused by the homepage property of your package.json file, as shown in the output of npm run build
If you adjust that property in the package.json your build will be fine.
{
"name": "react-todo-app",
"version": "0.1.0",
"private": true,
"homepage": "https://maksymilianMroz.github.io/react-todo-app",
...
}
I have an app which I'm deploying to gh-pages with npm gh-pages package
I do this command "deploy": "npm run build && gh-pages -d build" it creates build folder normally.
But when I go to gh-pages it is rendering only one static component. You can see here
In networks I can see that resources are loading up, js files, css files.
I'm not sure what the problem is. Can it be because I'm using react router?
All the help will be much appreciated.
Full code can be found here link
The problem is that you are hosting your React App in a subdirectory, which means that your route "/" is not valid here anymore.
Add the homepage property in your package.json file.
"homepage": "https://kiraburova.github.io/Marvel-ReactJS-API/",