Search code examples
reactjscompilationcreate-react-appreact-router-v4

Why React-Create-App fails to read ReactRouter data type?


I try currently to build a React-Create-App. It's a package available on github - latest commit 8 days ago.

My compiler fails to translate my ReactRouters code.

Here my App.js code, first edit:

import React, { Component } from 'react';
import './App.css';
import { BrowserRouter as Router, Route, Link} from 'react-router-dom';


class App extends Component {
  render() {
    return (

      <Router>
           <div className="App">
              <Route path='/' render={
                  ()=> {
                    return (<h1> Welcome Home </h1> ) ;

                  }

              }/>
           </div>
     </Router>
    );
  }
} 


export default App;

The error log is the following :

Failed to compile.

Error in ./src/App.js Module not found: 'react-router-dom' in [current folder]

@ ./src/App.js 16:22-49

But when I eject my ReactCreateApp I effectively see a react-router-dom in package JSON:

  • { "react-router-dom": "^4.2.2" }

How do I fix this?


Solution

  • I tried this in a codesandbox and it works fine. Have a look here. https://codesandbox.io/s/7o3qjyy6

    Try an npm install?

    EDIT

    I created an app this time without codesandbox.

    npx create-react-app my-app
    cd my-app/
    

    Added the line in package.json as create-react-app itself says for adding a router like this here: https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/template/README.md#adding-a-router

    "react-router-dom": "^4.2.2"
    

    Did an

    npm i

    and it worked.