react报错export ‘Switch‘ (imported as ‘Switch‘) was not found in ‘react-router-dom‘

原创 已于 2022-04-16 00:48:52 修改 · 1.9k 阅读 · 1 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#react

于 2022-03-30 14:05:15 首次发布
本文介绍react-router-dom从V5升级到V6的主要变化，包括Switch重命名为Routes，Route组件特性的调整如component和render被element替代，以及如何更简便地实现嵌套路由。

b67c30e0d3a545da8b82153e8f66f1d7.png

react-router-dom从V5升级到V6后改变：

(1) Switch 重命名为 Routes

(2) Route 的新特性变更 ,component/render被element替代

(3) 嵌套路由变得更简单

 

 

 

“export ‘createRouter‘ (imported as ‘VueRouter‘) was not found in ‘vue-route
weixin_46245846的博客
04-01 1295
"export ‘createRouter’ (imported as ‘VueRouter’) was not found in 'vue-route router.js 代码 更新router版本 npm install --save vue-router@next 下面展示一些 router.js。 import * as VueRouter from 'vue-router' const routes = [ { path: '/',redirect:'/login'}, {pa
react 导入 react-router-dom@6.3.0版本,引入Switch报 ‘Switch‘ is not exported from ‘react-router-dom‘
m0_63573982的博客
05-30 1024
如上图所示报错,经过查阅学习: react-router-dom从V5升级到V6后，有些使用做了改变： (1) Switch 重命名为 Routes // v5中: exact 精确路由 component 组件 <Switch> <Route exact path="/"> <Home /> </Route> <Route path="/profile" component={Profile}> ..
export ‘Switch‘ (imported as ‘Switch‘) was not found in ‘react-router-dom‘
热门推荐
小白目的博客
02-27 1万+
一跟着网上做react项目时，代码中以下代码： import { HashRouter, Route, Switch, Redirect } from 'react-router-dom' 出现了以下俩个报错： export 'Switch' (imported as 'Switch') was not found in 'react-router-dom' export 'Redirect' (imported as 'Redirect') was not found in 'react-r
Switch‘ (imported as ‘Switch‘) was not found in ‘react-router-dom‘
qq_45679015的博客
02-13 822
问题：使用<Switch>标签报错 原因：最新版本是"react-router-dom": "^6.2.1"已经将Switch改为Routes。 解决： （1）将<Switch>标签改为<Routes>标签 （2）卸载原先版本，再安装6以下的版本 npm uninstall react-router-dom npm install react-router-dom@5 ...
export ‘Switch‘ (imported as ‘Switch‘) was not found in ‘react-rou ter-dom‘ (possible exports:
KaiSarH
05-16 981
export 'Switch' (imported as 'Switch') was not found in 'react-rou ter-dom' (possible exports:
React使用router时报错export ‘Switch‘ (imported as ‘Switch‘) was not found in ‘react-router‘解决
Rice_w的博客
07-30 2558
但是，我已经安装过了router相关的依赖，并且已经引入，查找原因，发现是安装react-router-dom版本过低的原因，这是。最近在学习React的时候，使用路由时遇到一个问题，就是每当我一引入路由时，就会报错，提示应当引入switch。...
export useHistory (imported as 'Switch') was not found in 'react-router-dom'
01-20
当遇到 `export 'Switch' (imported as 'Switch') was not found in 'react-router-dom'` 错误时，这通常是因为使用的 `react-router-dom` 版本不同所引起的 API 变化。在较新的版本中，`Switch` 已经被移除并由 `...
export 'Switch' (imported as 'Switch') was not found in 'react-router-dom'
06-09
在 React Router v6 中，Switch 被移动到了 react-router 包中，所以你需要从 react-router 中导入 Switch，而不是从 react-router-dom 中导入。可以尝试使用如下代码导入 Switch： ```javascript import { Switch ...
export 'default' (imported as 'NavLink') was not found in 'react-router-dom' (possible exports
最新发布
08-24
在使用 `react-router-dom` 时，如果遇到 `export 'default' as 'NavLink' not found in 'react-router-dom'` 这类错误，通常是因为版本差异导致的模块导入问题。`react-router-dom` 的不同版本对组件的导出方式有所...
export 'Routes' (imported as 'Routes') was not found in 'react-router-dom'
09-07
这将卸载当前安装的react-router-dom和react-router，并重新安装5.x.x版本的react-router-dom和react-router，以解决`export 'Routes' (imported as 'Routes') was not found in 'react-router-dom'`的问题。...
使用react路由时，export ‘Switch‘ (imported as ‘Switch‘) was not found in ‘react-router‘报错
梨城毒妃的博客
06-07 2527
export 'Switch' (imported as 'Switch') was not found in 'react-router'
react-router-dom export ‘Switch‘ was not found in ‘react-router-dom‘错误解决方法
潘晓宇(panxiaoyu)的专栏
02-27 1359
问题原因，版本问题。 v5Switch可以使用，v6升级后需要调整对应方法 少し古いガイドラインに沿ってアプリ制作をしていたら、いきなりSwitchがないというエラー。 react-router-domのバージョンが原因。v6以降はSwitchがRoutesになり書き方に変更点が数カ所。 ①v5に戻す、②v6の書き方へ変更するの２種類の対処法をまとめました。 対処法① バージョンをv5に戻す 以下のコマンドで、現行バージョンをアンインストールして、v5をインストールし直す。 npm u...
关于react-router的踩得那些坑： export ‘Switch‘ (imported as ‘Switch‘) was not found in ‘react-router‘报错
world12312312的博客
02-14 5088
今天写react项目出现了个报错，前前后后整了两个多小时，这里分享一下，避免踩坑 我们知道，在react项目里使用路由的集中管理，需要安装react-router-config，而在我安装引入之后就出现以上报错，后面改版本，切node版本，都不好使。 我只好顺着错误去看看react-router-config的源码，这里发现react-router-config使用的竟然还是react-router v5的Switch，，我的react-router-dom是^
create-react-app初始化后，增加路由，及报错 ‘Switch‘ is not exported from ‘react-router-dom‘. 的处理
糖豆叭叭博客
11-10 1893
#### create-react-app初始化后，增加路由 ``` npm install --save react-router-dom ``` 当前最新的react-router-dom版本 ``` "react-router-dom": "6.0.2", ``` #### 修改App.js代码 ``` import './App.css'; import React from 'react'; // 路由使用 history模式 import { BrowserRouter
react路由引入报错xxx is not exported from ‘react-router-dom‘
leizixi的博客
11-18 1369
我的做法是: 1.我卸载了 react-router-dom 的第 6 版 npm uninstall react-router-dom 2.并安装了 react-router-dom 的 5.2.0 版本 npm install react-router-dom@5.2.0 这样就没报错了,还要注意一点的是,用npm 就一直用npm,千万不要和yarn混着用 ...
export ‘withRouter‘ (imported as ‘withRouter‘) was not found in ‘react-router-dom‘ 问题解决
wejack的专栏
02-16 2006
export 'withRouter' (imported as 'withRouter') was not found in 'react-router-dom' 问题解决
export default (imported as router) was not found_Vue（Vue项目、路由vue-router、网络请求vue-resource） 的安装与使用...
weixin_39917718的博客
10-27 955
一、Vue项目的安装1. 安装vue脚手架 Npm install --global vue-cli;如已经装过，可忽略2. 新建安装vue 项目 Vue init webpack vue1(项目名称) Cd >vue1 cd 到vue1根目录3. 启动项目 Npm run dev，若启动失败 安装依赖环境，Npm install二、路由的安装与配置1. 安装路由...
react报：export useHistory (imported as useHistory) was not found in react-router-dom
从事前端，不断积累经验，学习新的技术。头像不是本人是莉莉崽（美貌、可爱集于一身的小姐姐，小仙女），一个宝藏博主，值得喜欢！
08-31 8275
react-router-dom v4 可以使 withRouter (函数组件里可以用这个方法),当然 也可以直接 this.props.history.push。很明显 这个报错 是说 react-router-dom 里没有 useHistory。这个就涉及 react-router-dom这个插件的版本问题了。react-router-dom v5 是使用 useHistory。问题出在这里了 不同版本差异化，所以用之前需要确认版本。react-router-dom v6 里。..........
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

船长在船上

您的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值