这篇文章主要讲解了“react刷新找不到页面如何解决”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“react刷新找不到页面如何解决”吧! react刷新找不到页面的解决办法:1、找到并打开“app.jsx”文件;2、在“app.jsx”里面定义路由协议的时候通过“c免费云主机、域名lass App extends Component {render() {return (
…”代码定义即可。react部署完以后,刷新页面会报错找不到视图今天上午部署完项目以后点击路由都可以跳转,但是在相应的路由刷新的时候却报错了。
Failedtolookupview"error"inviewsdirectory
项目在本地的时候是可以正常使用的,单是为什么部署到服务器上以后刷新它就报错。无法找到对应的视图了呢?首先排查了noded的配置文件。因为我是把react的项目npm run build以后,把build后的文件放在node的public文件里面。这样启动后端node bin/www以后,node就可以读取public里面的文件。然后开始查看node的app.js文件,文件里面都是配置好的
app.set('views',path.join(__dirname,'views')); app.engine('.html',require('ejs').__express); //app.set('viewengine','jade'); app.set('viewengine','html'); app.use(logger('dev')); app.use(express.json()); app.use(express.urlencoded({extended:false})); app.use(cookieParser()); app.use(express.static(path.join(__dirname,'public')));//这句话就是express会读取public里面的静态文件
后端没有错误就开始查看前端的文件既然是路由路径不对我就查找路由相关的信息,然后就找到答案了。是因为我使用的是BrowserRouter错误原因:客户端路由和服务端路由是有区别的,你在浏览器内可以由首页跳转到其他路由地址,是因为这是由前端自行渲染的,你在React Router定义了对应的路由,脚本并没有刷新网页访问后台,是JS动态更改了location。当你刷新时,你首先是访问的后台地址,然后返回的页面内加载了React代码,最后在浏览器内执行;也就是说如果这个时候报404,是因为你后台并没有针对这个路由给出返回HTML内容,也谈不上执行React Router了。使用HashRouter,不要使用BrowserRouter,这样所有的请求都会定位到index.html这一个页面,服务器端也不需要任何配置了。解决方法 :在app.jsx里面定义路由协议的时候可以如下这个定义:
importReact,{Component}from'react'; import{HashRouterasRouter}from"react-router-dom"; importNavfrom'./component/Menu/Menu'; importFootContentfrom'./component/Footer/Footer'; importMinContentfrom'./component/content/mainContent'; import{Layout}from'antd'; classAppextendsComponent{ render(){ return(); } } exportdefaultApp;
感谢各位的阅读,以上就是“react刷新找不到页面如何解决”的内容了,经过本文的学习后,相信大家对react刷新找不到页面如何解决这一问题有了更深刻的体会,具体使用情况还需要大家实践验证。这里是云技术,小编将为大家推送更多相关知识点的文章,欢迎关注!
本文小编为大家详细介绍“node返回乱码如何解决”,内容详细,步骤清晰,细节处理妥当,希望这篇“node返回乱码如何解决”文章能帮助大家解决疑惑,下面跟着小编的思路慢慢深入,一起来学习新知识吧。 node返回乱码的解决办法:1、打开相应的node模块文件;2、…