0

Quiero crear 5 paginas en carpetas separadas para un unico proyecto y añadirles componentes que pueda utilizar en todas ellas el caso es que estoy intentando rutear las paginas para verlas en mi localhost:3000/nombredelapagina y me sale esto...

./src/index.js Module not found: Can't resolve './pages/configuracion' in 'C:\Users\Nicko\Desktop\node\src'

introducir la descripción de la imagen aquí

a la izquierda tengo el "App" que sustituí por index.js y a la derecha una de las paginas de prueba en este caso configuracion.js que está en ./pages/configuracion

2
  • Bienvenido a Stack Overflow en español! Mira Cómo preguntar para que tu pregunta sea mejor recibida. También, aprovecha y haz el recorrido de bienvenida para entender mejor cómo funcionamos y de paso obtener tu primera medalla! La routa que declaraste en route, es directamente configuracion.. no es pages/configuracion. No confundas rutas del navegador con donde metes las cosas en tu proyecto, son dos cosas distintas
    – gbianchi
    Commented el 20 oct. 2019 a las 23:47
  • Bienvenido a Stack Overflow en español! Por favor, no uses imágenes salvo que sea absolutamente necesario. Mira por favor aca. Los errores y tu codigo deben ir como texto, siempre
    – gbianchi
    Commented el 20 oct. 2019 a las 23:47

1 respuesta 1

0

Te falta añadir el Router, Switch, etc... te dejo un ejemplo de como tienes que mentar las rutas.

import React from "react";
import ReactDOM from "react-dom";
import { BrowserRouter as Router, Switch, Route, Link } from "react-router-dom";

import "./styles.css";

function App() {
  return (
    <div className="App">
      <h1>Hello CodeSandbox</h1>
      <h2>Start editing to see some magic happen!</h2>
      <Router>
      <div>
        <nav>
          <ul>
            <li>
              <Link to="/">Home</Link>
            </li>
            <li>
              <Link to="/about">About</Link>
            </li>
            <li>
              <Link to="/users">Users</Link>
            </li>
          </ul>
        </nav>

        {/* A <Switch> looks through its children <Route>s and
            renders the first one that matches the current URL. */}
        <Switch>
          <Route path="/about">
            <About />
          </Route>
          <Route path="/users">
            <Users />
          </Route>
          <Route path="/">
            <Home />
          </Route>
        </Switch>
      </div>
    </Router>
    </div>
  );
}

function Home() {
  return <h2>Home</h2>;
}

function About() {
  return <h2>About</h2>;
}

function Users() {
  return <h2>Users</h2>;
}

const rootElement = document.getElementById("root");
ReactDOM.render(<App />, rootElement);

También el link al proyecto de CodeSandbox: https://codesandbox.io/s/lingering-haze-2e26c

Un saludo.

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.