使用react路由时，export ‘Switch‘ (imported as ‘Switch‘) was not found in ‘react-router‘报错

最新推荐文章于 2023-03-09 00:17:04 发布
最新推荐文章于 2023-03-09 00:17:04 发布
阅读量2.3k 收藏 2
点赞数 1
文章标签： react.js javascript 前端 react
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_41746338/article/details/125164606
版权

在使用react-router-config时，遇到此报错export ‘Switch’ (imported as ‘Switch’) was not found in ‘react-router’
在这里插入图片描述
打开react-router中的index.js文件，发现导出的是Routes并非Switch,在react-router-config.js中却引人了Switch，分析是因为版本问题
在项目中把react-router-dom的版本号改成5.x.x，再重新npm i ,可是问题并没有解决，去react-router中一看还是6.x.x的版本
最终简单粗暴的卸载重装

npm uninstall react-router react-router-dom
npm install react-router@5 react-router-dom@5

注意：一定要把react-router也重装，因为package.json文件中看不到react-router，得手动卸载重装

梨城毒妃
关注
  • 1
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
react-router-cache-route:使用类似React-Router的缓存进行路由在Vue
05-11
缓存路由 英文| 使用缓存为Vue中的keep-alive类的react-router 。 如果只想要<KeepAlive> ，请尝试 React v15 + React-Router v4 + 问题 使用Route ，前进或后退时无法缓存组件，这会导致数据丢失和交互 原因与解决方案 Route不匹配时，组件将被卸载 阅读源代码之后Route ，我们发现使用children撑起一个功能，可以帮助控制呈现行为。 隐藏而不是删除将解决此问题。 安装 npm install react-router-cache-route --save # or yarn add react-router-cache-route 用法 用CacheRoute替换Route 用CacheSwitch替换Switch （因为Switch仅保留第一个匹配的状态路由，并卸载其他匹配状态的路由） impor
React使用router时报错export ‘Switch‘ (imported as ‘Switch‘) was not found in ‘react-router‘解决
Rice_w的博客
07-30 2187
但是，我已经安装过了router相关的依赖，并且已经引入，查找原因，发现是安装react-router-dom版本过低的原因，这是。最近在学习React的时候，使用路由时遇到一个问题，就是每当我一引入路由时，就会报错，提示应当引入switch。...
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
export ‘Switch‘ (imported as ‘Switch‘) was not found in ‘react-rou ter-dom‘ (possible exports:
KaiSarH
05-16 666
export 'Switch' (imported as 'Switch') was not found in 'react-rou ter-dom' (possible exports:
export ‘withRouter‘ (imported as ‘withRouter‘) was not found in ‘react-router-dom‘ 问题解决
wejack的专栏
02-16 1605
export 'withRouter' (imported as 'withRouter') was not found in 'react-router-dom' 问题解决
Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a
前端高薪进击手记
03-09 801
意思是说：v5版本的 react-router-config 包中的所有方法都已经被迁移到了react-router 版本的core核心代码中. 如果你偏向于或者需要把路由定义成JavaScript对象而不是react组件的话，那么你会爱上这种方式，也就是使用useRoutes 方法。这个错误提示是我在配配react的SSR中为了支持路由而报的错误提示。这个错误提示有点奇怪，不是完全的Error提示，而是Warning。万万没想到，搞了我懵逼一天的竟然是一个版本问题。
react-router-dom export ‘Switch‘ was not found in ‘react-router-dom‘错误解决方法
潘晓宇(panxiaoyu)的专栏
02-27 1150
问题原因，版本问题。 v5Switch可以使用，v6升级后需要调整对应方法 少し古いガイドラインに沿ってアプリ制作をしていたら、いきなりSwitchがないというエラー。 react-router-domのバージョンが原因。v6以降はSwitchがRoutesになり書き方に変更点が数カ所。 ①v5に戻す、②v6の書き方へ変更するの２種類の対処法をまとめました。 対処法① バージョンをv5に戻す 以下のコマンドで、現行バージョンをアンインストールして、v5をインストールし直す。 npm u...
storybook-found-router：使用Found路由的React组件的Storybook装饰器
02-04
这个故事书装饰器将允许您通过向故事添加内存路由器包装器来呈现使用任何Found路由器实例的应用程序的React组件。 您可以使用两个参数routeConfig和initialLocation自定义装饰器，以利用内置的功能并设置初始位置在...
koa-react-router：用于koa 2的react-router中间件
02-03
koaReact路由器 koa 2中间件，用于React... import reactrouter from 'koa-react-router' ; import App from './App' ; import Container from './containers/PageContainer' ; const app = new Koa ( ) ; app
详解如何给React-Router添加路由页面切换时的过渡动画
12-03
PS: 本篇文章使用的React-Router版本为react-router-dom: ^5.0.0 (兼容4.x) 使用过Vue2的同学们应该都知道这个内置组件，它可以帮我们添加过渡动画，之前一直用它来给Vue-Router路由的跳转添加转场动画，使用起来...
react-router-sample:使用嵌套路由React路由器示例
04-21
React路由器样本用嵌套路由来React路由器示例。用法yarnyarn dev执照麻省理工学院执照版权所有（c）2021 Alexander Zeitler 特此免费授予获得此软件和相关文档文件（“软件”）副本的任何人无限制地处理软件的权利，...
“export ‘default‘ (imported as ‘xxx‘) was not found in ‘xxx‘解决办法
热门推荐
YukiGreen的博客
07-13 2万+
"export 'default' (imported as 'xxx') was not found in 'xxx'解决办法
react报：export useHistory (imported as useHistory) was not found in react-router-dom
从事前端，不断积累经验，学习新的技术。头像不是本人是莉莉崽（美貌、可爱集于一身的小姐姐，小仙女），一个宝藏博主，值得喜欢！
08-31 6589
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 里。..........
关于react-router： export ‘Switch‘ (imported as ‘Switch‘) was not found in ‘react-router‘报错
qqoies的博客
05-07 665
import React, { memo } from 'react' import { renderRoutes } from "react-router-config"; import router from "./router" import YYAppHeader from "@/components/app-header"; import YYAppFooter from "@/components/app-footer"; const App = memo(() => {
Swiper分页 swiper-pagination 无法显示
impQAQ的博客
04-29 594
swiper版本换为 5.4.5 版本 5.4.5版本较之其他更加稳定 npm uninstall swiper npm install [email protected] --save
关于react-router的踩得那些坑： export ‘Switch‘ (imported as ‘Switch‘) was not found in ‘react-router‘报错
world12312312的博客
02-14 4813
今天写react项目出现了个报错，前前后后整了两个多小时，这里分享一下，避免踩坑 我们知道，在react项目里使用路由的集中管理，需要安装react-router-config，而在我安装引入之后就出现以上报错，后面改版本，切node版本，都不好使。 我只好顺着错误去看看react-router-config的源码，这里发现react-router-config使用的竟然还是react-router v5的Switch，，我的react-router-dom是^
vue-awesome-swiper使用与错误解决
九月萩的博客
04-19 2052
一、简介 Swiper常用于移动端网站的内容触摸滑动 Swiper是纯javascript打造的滑动特效插件，面向手机、平板电脑等移动终端，以及PC端网站。Swiper能实现触屏焦点图、触屏Tab切换、触屏多图切换等常用效果。 二、安装与挂载 2.1 npm下载安装： npm install vue-awesome-swiper --save --save本地测试还是项目上线，都会用到vue-a...
vue 使用 vue-awesome-swiper（swiper）解决方法
buzhidjiaosha的博客
03-17 2076
一、安装 npm install swiper [email protected] --save 二、页面引入 *这里说明一下：完全不用在main.js写那些没用的，仅需要当前组件或者页面引入一下就行 import { Swiper } from "vue-awesome-swiper"; import 'swiper/dist/css/swiper.css' 三、详细 <div class="swiper-container swiper-no-swiping"
【react框架】学习记录9-学习路由react-router-dom的使用
庞囧的博客
07-25 463
文章目录前言安装使用相关组件BrowserRouterLink与Route 前言 附上汉化文档地址 安装 yarn add react-router-dom 使用 相关组件 BrowserRouter 这个组件是history模式的路由器，用于管理包含在内的路由组件，所以一般会直接放在App.jsx外层，在index.js中写： ... import {BrowserRouter} from 'react-router-dom' ReactDOM.render( <BrowserRouter&g
export 'Switch' (imported as 'Switch') was not found in 'react-router'
最新发布
01-13
根据提供的引用内容，当在使用`react-router`库时，出现了`export 'Switch' (imported as 'Switch') was not found in 'react-router'`的错误提示时，可能是因为`Switch`组件没有正确导入。这个错误通常发生在使用`...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值