change the default localhost path react

Question

change the default localhost path. For example: http://localhost:3001/ by the path http://localhost:3001/home . I would like the when I launch npm start that I arrive directly on this path http://localhost:3001/ home . I tried modifying in the package.Json file, but it doesn't work. Thank you for help

<BrowserRouter>
        <Routes>
          <Route path={"/"}  />
          <Route element={<ViewParentCustomer />} >
            <Route path={RouteTypes.REDIRECT_HOME} element={<Home/>} />
            <Route path={RouteTypes.ROUTE_OUR_HISTORY} element={<OurHistory />} />
           
            
            <Route path={RouteTypes.ROUTE_COMMAND_CUSTOMER_ACCOUNT} element={<ProtectedRoutes ><DetailCommand /></ProtectedRoutes>} />
            <Route path={RouteTypes.ROUTE_SIGNUP} element={<Registration />} />
            <Route path={RouteTypes.ROUTE_FORBIDDEN} element={<AccessForbidden />} /> 
          </Route>

        </Routes>
</BrowserRouter>

Hey tony, watch this thread - https://stackoverflow.com/questions/34735580/how-to-do-a-redirect-to-another-route-with-react-router — talm0r, Jul 05 '22 at 09:02
Does this answer your question? [How to do a redirect to another route with react-router?](https://stackoverflow.com/questions/34735580/how-to-do-a-redirect-to-another-route-with-react-router) — Kapobajza, Jul 05 '22 at 09:07
the proposed solutions do not work react-router-dom, impossible to import IndexRoute — tony, Jul 05 '22 at 09:46
Can you include your package.json file, and any other routing/navigation code, as part of your [mcve]? — Drew Reese, Jul 05 '22 at 15:57

StepUp · Answer 1 · 2022-07-05T11:42:22.990

0

You can redirect it like this:

<Redirect exact from="/" to="pastry" />

Read more about redirecting here

UPDATE:

You can use Route. Special thanks to Kapobajza:

<Route path="/" element={ <Navigate to="/pastry" /> } />

edited Jul 05 '22 at 11:42

answered Jul 05 '22 at 09:05

StepUp

36,391
15
88
148

1

I can't import Redirect , react router dom doesn't offer it to me . @StepUp – tony Jul 05 '22 at 09:28
1

@tony https://stackoverflow.com/a/69872699/5049799 – Kapobajza Jul 05 '22 at 09:51
Thanks for the help, actually it doesn't work for what I'm looking for. I wish that when the application launches that I arrive directly at http://localhost:3001/pastry – tony Jul 05 '22 at 10:24
@tony please, see my updated answer – StepUp Jul 05 '22 at 10:27
I tried the answer you edited and thank you @StepUp, but I can't import Redirect with react-router-dom – tony Jul 05 '22 at 11:23
the solution : } /> thank you all – tony Jul 05 '22 at 11:28

score 0 · Answer 2 · answered Jul 05 '22 at 09:08

0

Replace

  <Route path={"/"} element={<Home/>} />

with

<Route path="*" element={<Navigate to="/home" />}/>

Imports:

import {Routes, Route, Navigate} from "react-router-dom";

answered Jul 05 '22 at 09:08

Priyanshu

73
6

score 0 · Accepted Answer · answered Jul 05 '22 at 11:29

0

the solution : <Route path="/" element={ <Navigate to="/pastry" /> } />

answered Jul 05 '22 at 11:29

tony

199
4
15

Please read [How do I write a good answer?](https://stackoverflow.com/help/how-to-answer). While this code block may answer the OP's question, this answer would be much more useful if you explain how this code is different from the code in the question, what you've changed, why you've changed it and why that solves the problem without introducing others. – Saeed Zhiany Jul 07 '22 at 08:10

change the default localhost path react

3 Answers3