Question posted in
Some documentation to get you started can be found here.

Route does not work on live server but it work on localhost – Apache

What is wrong with this code. It works on localhost but it doesn’t work on live Apache server. I already specify the homepage on package json and also have an htaccess. It only blank on live server.

app.js:

import React from 'react'
import {
  Route,
  Switch,
  Redirect,
  BrowserRouter as Router
 } from 'react-router-dom'

import Login from './component/login/index'

function App() {
   return (
     <Router>
        <Switch>
          <Route exact path="/" component={Login} />
          <Route path='/login' component={Login} />
        </Switch>
     </Router>
  );
}

export default App;

component index.js:

import React from 'react'
export default function Login(props) {

   return (
       <div>Login</div>
   )
}

htaccess:

     Options -MultiViews
     RewriteEngine On
     RewriteCond %{REQUEST_FILENAME} !-f
     RewriteRule ^ index.html [QSA,L]

Dependencies:

 "dependencies": {
     "react": "^16.8.6",
     "react-dom": "^16.8.6",
     "react-router-dom": "^5.0.1",
     "react-scripts": "3.0.1",
  },
Tags:

2

Answers


  1. 0

    You can add this to your htaccess file to redirect every request to index except request for images, css and js files

    RewriteCond %{REQUEST_URI} !^/images [NC]
RewriteCond %{REQUEST_URI} !^/css [NC]
RewriteCond %{REQUEST_URI} !^/js [NC]
RewriteRule ^([^/]+)/?$ index.html [L]
    Login or Signup to reply.
  2. 0

    Try with this .htaccess,

    RewriteEngine On
RewriteCond %{REQUEST_URI} !^/index.html$
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_URI} !.(css|gif|ico|jpg|js|png|swf|txt|svg|woff|ttf|eot)$
RewriteRule . index.html [L]
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search