问题描述
您好,我需要部署React应用.
Hello i need to deploy react app.
要实现这一点,我要运行:"npm run build"
To achieve that i run : "npm run build"
在那之后,我在vhost.conf中添加了vhost
after that in my vhost.conf i've added vhost
<VirtualHost *:80>
ServerName hello.local
DocumentRoot c:/wamp64/www/hello_world/build
<Directory "c:/wamp64/www/hello_world/build">
Options Indexes FollowSymLinks MultiViews
AllowOverride All
Require all granted
</Directory>
我还添加了etc/hosts hello.local
i've also added to etc/hosts hello.local
我当然已经在httpd.conf中启用了mod重写
of course i've enabled mod rewrite in httpd.conf
当我运行我的react应用程序的hello.local/主页时,显示正确,但是当我想转到react-react路由路径hello.local/example时,我收到404 not found错误.请帮助可能是什么? Apache配置问题或react-router有一些错误?问候
When i run hello.local/ main page of my react app display properly, but when i want to go to react-react route path hello.local/example i received 404 not found error. Please help what can it be ? It's problem with apache configuration or react-router has some mistake ? Regards
推荐答案
这是SPA常见的问题.在SPA中,路由主要发生在客户端.在您的情况下,大多数情况下react-router
应该可以完成这项工作.由于整个js捆绑为一个文件并在index.html
中提供,因此您需要为服务器中non-existing
的所有路径提供index.html
.
This is a common issue that comes up for SPA. In SPA, mostly the routing happens on client side. In your case, mostly react-router
should be doing the job. Since the whole js is bundled as a single file and is served in index.html
, you need to serve index.html
for all paths that is non-existing
in your server.
您必须添加一个这样的配置
You have to add a config like this
RewriteEngine On
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -f [OR]
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -d
RewriteRule ^ - [L]
RewriteRule ^ /index.html [L]
因此,如果服务器中没有匹配的路径,则将提供index.html.然后,javascript将执行,react-router
(客户端路由)将接管并显示该路由的正确组件.
So, if there is no matching path in your server, the index.html would get served. Then the javascript would execute and react-router
(client side routing) will take over and display the correct component for the route.
对于大多数SPA都是如此,因为路由在客户端进行.
This is true for most SPA, where the routing happens on client side.
这篇关于反应生产版本404未找到的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!