代码之家 › 专栏 › 技术社区 › Shanu k k

无法加载文件“”/dom'来自模块'react-router'-react router dom

react-router-dom react-router reactjs javascript

Shanu k k · 技术社区 · 3 周前

我已经安装了最新的react-router-dom,并在package.js中显示了它 "react-router-dom": "^7.0.2" 当我检查时 npm -v react-router-dom its showing 10.9.0 。在我的代码中

import React from "react";
import ReactDOM from "react-dom";
import Header from "./components/Header";
import Body from "./components/Body";
import About from "./components/About";
import {
  createBrowserRouter as Router,
  RouterProvider
} from "react-router-dom";

const AppLayout = () => {
  return (
    <div className="app">
      <Header />
      <Body />
    </div>
  );
};

const appRouter= createBrowserRouter ([
  { path: "/", element: <AppLayout /> },
  { path: "about", element: <About /> },
])

const root = ReactDOM.createRoot(document.getElementById("root"));
root.render(<RouterProvider router= {appRouter} />);

我得到和错误一样

@包裹/核心:无法从解析“react-router/dom” './node_modules/react-router-dom/dist/index.mjs D: \Namthe\node_modules\react路由器dom\dist\index.mjs:13:48 12| //index.ts

13|从“react-router/dom”导入{HydratedOuter,RouterProvider}; |从“反应路由器”导出*;15 |出口 {@package/resolver默认值:无法从模块加载文件“./dom” '反应路由器'

1 回复 | 直到 3 周前

Drew Reese 3 周前

React Router 7确实改变了他们组织代码的方式。这个 RouterProvider 组件未从导出 react-router-dom ,它来自一个更深入的嵌套包,特定于平台,例如DOM特定, react-router/dom 在v7中, react-router 是主要的切入点。

卸载 反应路由器dom : npm un react-router-dom
安装 反应路由器 : npm i react-router@latest

更新导入来源 反应路由器

import {
  createBrowserRouter as Router,
  RouterProvider
} from "react-router";

有关完整详细信息,请参阅:

Installation 指导
这个 Upgrading from v6 迁移指南
Changelog

推荐文章

siddhant kumar · Can'读取未定义的属性(读取“path”)

2 年前

sdfsdf · useNavigate替换选项的作用是什么?

2 年前

Tanner Summers · react router 6渲染的子级问题

2 年前

Tesh Aych · react axios URL连接返回404未找到

2 年前

wahida cse · 如何在mongodb中只删除一个对象,而不是删除所有与筛选查询匹配的对象?

2 年前

Kevin Tanuwijaya · 如何使用参数来响应路由器dom链接

2 年前

Roy · 带有不同道具的react组件的多个实例无法正常工作

2 年前

Ahmed Haque · 通过出口上下文传递多个状态变量

2 年前

kiryl · 警告。/。缓存/根目录。js尝试导入错误:“BaseContext”未从“@gatsbyjs/reach router”导出(作为“BaseContext”导入)

2 年前

Ancross · 链接未路由到组件

2 年前