- 39
- 0
问题描述
React修改了Browserrouter为Hashrouter运行yarn build生成的项目
但是生成的项目打开页面访问子路由还是出现404错误
打开index页面访问的域名是file:///D:/client/build/index.html#/
点开子路由后访问的域名是file:///D:/resume/19就出现访问不到错误,错误如下:
找不到您的文件
该文件可能已被移至别处或遭到删除。
ERR_FILE_NOT_FOUND
问题出现的环境背景及自己尝试过哪些方法
react-router-dom的版本为4.2.2
"react-router-dom": "^4.2.2",
相关代码
// 请把代码文本粘贴到下方(请勿用图片代替代码)
App.js里的代码如下
import React, { Component } from 'react';
import logo from './logo.svg';
import {
Collapse,
Navbar,
NavbarToggler,
NavbarBrand,
Nav,
NavItem,
NavLink,
UncontrolledDropdown,
DropdownToggle,
DropdownMenu,
DropdownItem,
ListGroup,ListGroupItem
} from 'reactstrap';
import Header from './component/Header.js';
import Index from './component/Index.js';
import Login from './component/Login.js';
import MyResume from './component/MyResume.js';
import Resume from './component/Resume.js';
import Register from './component/Register.js';
import AddResume from './component/AddResume.js';
import EditResume from './component/EditResume.js';
import Logout from './component/Logout.js';
import { HashRouter as Router,
Route,
Switch,
Link
} from "react-router-dom";
class App extends Component {
render() {
return (
<Router>
<div className="App">
<Header/>
<div className="main">
<Switch>
<Route path="/register" component={Register} />
<Route path="/login" component={Login} />
<Route path="/logout" component={Logout} />
<Route path="/myresume" component={MyResume} />
<Route path="/resume/:id" component={Resume} />
<Route path="/addresume" component={AddResume} />
<Route path="/editresume/:id" component={EditResume} />
<Route path="/" component={Index} />
</Switch>
</div>
</div>
</Router>
);
}
}
export default App;
你期待的结果是什么?实际看到的错误信息又是什么?
yarn build生成的项目路由打开子页面访问正常。打开子页面可以访问到域名为 file:///D:/client/build/index.html#/resume/19 而不是file:///D:/resume/19
- 共 0 条
- 全部回答
-
哪庅颓廢╮呮湜潙沵 普通会员 1楼
可能的原因有以下几点:
-
代码中使用了新的hash模式,导致Browserrouter和Hashrouter之间无法正常通信。
-
配置文件中hash模式的配置错误,导致Browserrouter无法正确解析hash模式的路由。
-
确保你在yarn build命令中包含了所有需要的依赖项。
你可以尝试以下步骤来解决这个问题:
-
查看你的项目中的配置文件,确保你在yarn build命令中包含了所有需要的依赖项,包括Browserrouter和Hashrouter。
-
如果你的代码中使用了新的hash模式,尝试使用
react-router-dom库的HashRouter代替Browserrouter。 -
如果你在配置文件中配置了hash模式的路由,尝试在配置文件中取消配置新的hash模式。
-
如果以上步骤都无法解决问题,可能需要查看Browserrouter和Hashrouter的源代码,找出问题的原因。
-
- 扫一扫访问手机版
回答动态

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器更新之后。服务器里面有部分玩家要重新创建角色是怎么回事啊?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题函数计算不同地域的是不能用内网吧?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题ARMS可以创建多个应用嘛?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题在ARMS如何申请加入公测呀?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题前端小程序接入这个arms具体是如何接入监控的,这个init方法在哪里进行添加?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器刚到期,是不是就不能再导出存档了呢?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器的游戏版本不兼容 尝试更新怎么解决?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器服务器升级以后 就链接不上了,怎么办?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器转移以后服务器进不去了,怎么解决?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器修改参数后游戏进入不了,是什么情况?预计能赚取 0积分收益
- 回到顶部
- 回到顶部
