3

I'm struggling to find the solution to this issue. I'm using create-react-app and after running npm build I want to be able to open index.html in browser with 'doubleclick' from file location, without the need of npm or any server. I also want my routes and functionality of the app to work in this scenario. I've been doing some research on the matter but couldn't find much. I would like to know if it's possible and if anyone has any links or even solutions to share in case I'm missing something. Would be greatly appreciated.

Update:

I'm using ubuntu 17. My main route in src/App.js looks like so :

class App extends React.Component {
  render(){
    return(
      <Router basename="/">
        <Switch>
            <Route exact path="/" component={LoginComponent}/>
            <Route path="/app" component={AppLayout}/>
        </Switch>
      </Router>
    );
  }
}

And my index.js looks like so:

import App from './component/App';


ReactDOM.render(<App />, document.getElementById('root'));

After running npm run build and open build/index.html in browser, it's blue (the background) so some css gets to it, when i inspect it's showing with the comment inside it. I'm trying to get the app working in browser without using any kind of server. Just by opening index.html from build folder in the browser.

Note: everything works perfectly in dev

Many thanks in advance.

3
  • Are you trying to run it on the Win or Mac? Commented Aug 25, 2017 at 9:36
  • If you're using hash-based routes then it works fine. What specific problems are you facing? Commented Aug 25, 2017 at 9:43
  • I've updated the question. I'm opening index.html after running npm run build and it's blue (the background) so some css gets to it, when i inspect it's showing <div id="root"> with the comment <!-- react-empty: 1 --> inside it. I'm trying to get the app working in production in browser without using any kind of server. Commented Aug 30, 2017 at 11:19

1 Answer 1

2

I found that using <HashRouter> instead of <Router> fixed it.

Many thanks

Sign up to request clarification or add additional context in comments.

1 Comment

Finally the correct answer. The problems was the module react-router-dom, should be updated to HashRouter and Switch wrapper and finally works.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.