create-react-app icon indicating copy to clipboard operation
create-react-app copied to clipboard

React - Component link - Broken - bug

Open kshitiz305 opened this issue 1 year ago • 2 comments

Describe the bug

Link for the https://neutrino.js.org/packages/react-components/ need to be changed as it is giving 404 error.

Did you try recovering your dependencies?

(Write your answer here.)

Which terms did you search for in User Guide?

(Write your answer here if relevant.)

Environment

(paste the output of the command here.)

Expected behavior

(Write what you thought would happen.)

Actual behavior

image

Reproducible demo

(Paste the link to an example project and exact instructions to reproduce the issue.)

kshitiz305 avatar Jan 03 '24 18:01 kshitiz305

error when i use the Link component

i have an error when i use the Link component from react-router-dom i work on a new project on react 18 - router v6 this my test component

import { Link } from 'react-router-dom'

const Test = () => {
  return (
   <Link to="/">test</Link>
  );
}

export default Test

and this is my package.json

{
  "name": "e-commerce-perso",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@popperjs/core": "^2.11.8",
    "@reduxjs/toolkit": "^2.0.1",
    "@testing-library/jest-dom": "^5.17.0",
    "@testing-library/react": "^13.4.0",
    "@testing-library/user-event": "^13.5.0",
    "axios": "^1.6.2",
    "bootstrap": "^5.3.2",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "react-router-dom": "^6.21.1",
    "react-scripts": "5.0.1",
    "react-toastify": "^9.1.3",
    "uuid": "^9.0.1",
    "web-vitals": "^2.1.4"
  },

rayenhidri27 avatar Jan 05 '24 10:01 rayenhidri27

Links work in other components, just avoid to use it in the app component (in the return of the app) even if you include it another component and you include it in app, it's the same issue put links in components , and in app, put only the router like

function App() {
  const router = createBrowserRouter(
    createRoutesFromElements(
      <>
        <Route path="/" element={<App />} />
        <Route path="/test" element={<Test />} />
        <Route path="/testxx" element={<TestXX />} />
      </>
    )
  );
  return (
    <div className="App">
      <RouterProvider router={router}></RouterProvider>
    </div>
  );
}

export default App;

nested routes should work also

rayenhidri27 avatar Jan 05 '24 10:01 rayenhidri27