Skip to main content
2 de 2
agregadas carpertas
Richi
  • 867
  • 9
  • 31

module no encontrado Reactjs

estoy haciendo rutas para una app en react, estoy importando el componente "layout" a "navbar" pero me sale el siguiente error

Failed to compile ./src/componentes/shared/navbar.js Module not found: Can't resolve './componentes/routers/layouts'. estoy tratando de ver porque no me encuentra ese modulo en particular quizas, me he saltado la importacion de algun componente quizas.

LAYOUT:

import React from 'react';
import { Route, Switch } from 'react-router-dom';



export class Layout extends React.Component {
render() {
    return(

        <Switch>
            <Route exact path='/' component={Home} />
            <Route exact path='/home' component={Home} />
            <Route exact path='/servicios' component={Servicios} />
            <Route exact path='/contacto' component={Contacto} />
        </Switch>

    );
 }
}

NAVBAR:

import React from 'react';
import { Link } from 'react-router-dom';
import { Layout } from './componentes/routers/layouts';

export const NavBar = () => {
return(
    <div>
    <nav className="navbar navbar-expand-lg navbar-light bg-light">
        <Link to='/' className="navbar-brand">App_test</Link>
        <button className="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
            <span className="navbar-toggler-icon"></span>
        </button>

        <div className="collapse navbar-collapse" id="navbarSupportedContent">
            <ul className="navbar-nav mr-auto">
            <li className="nav-item active">
                <Link to='/home' className="nav-link">Home <span className="sr-only">(current)</span></Link>
            </li>
            <li className="nav-item">
                <Link to='/servicios' className="nav-link">Servicios</Link>
            </li>

            <li className="nav-item">
                <Link to='contacto' className="nav-link">Contacto</Link>
            </li>

            </ul>
            <form className="form-inline my-2 my-lg-0">
            <input className="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search" />
            <button className="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>
            </form>
        </div>
    </nav>

    </div>
);
}

Esta es la distribucion de las carpetas utilizadas dentro de mi proyecto, algo simple.

 _src
  _componentes
    _routers 
     - layouts.js

    _shared
     - contacto.js
     - footer.js
     - navbar.js
     - home.js
     - servicios.js

app.js
index.js
Richi
  • 867
  • 9
  • 31