使用 Netlify URL 问题部署的 React Redux 应用程序

Question

我的问题很简单。我构建了一个 React Redux 应用程序并尝试将其部署到 Netlify 上。一切正常，在线应用程序，安装的 SSL 证书，显示的根页面，域名......但是每当我尝试访问我的路由之一，如 myapp。com/login 我收到 404 错误。

你的帮助将是宝贵的，让我终于可以上线了。

非常感谢，希望我说得足够清楚了。

Answer 1

由于 React 应用程序中的路由是由 javascript 处理的，很可能您没有设置重定向规则。当您请求某个路由时，服务器找不到该路由，因为它不知道您的反应路由。您基本上必须将所有请求重新发送到 index.html 并让 React 处理所有路由。有一个关于如何为 netlify here

设置的指南

Answer 2

我怀疑您的问题出在 Netlify 上，因为正如 Martin 所解释的那样，React 本身会进行路由。最有可能发生的事情是您的父组件无法访问 react-router 道具，因此，每当 url 更改时，它都不会通过 shouldComponentUpdate。假设你有正确的语法，我会尝试用 withRouter 包装你的父组件，如下所示：

import {withRouter, Switch, Route} from 'react-router-dom'

class youComponent extends Component{
     constructor(props){
         super(props);
     }

     render(){
        let {teamName} = this.props;
        return(  
           <Switch>
               <Route path="/path2" component={ChildComponent} />
                ... other routes
               <Route path="/path3" render={(props) => <ChildComponent2 

teamName={teamName} />} />
              </Switch>
            )
      }
}

export default withRouter(yourComponent)

还要确保您的子组件可以访问来自 react-router-dom 的 history 属性。有时历史道具不会传递给子组件。

使用 Netlify URL 问题部署的 React Redux 应用程序

React Redux App Deployed with Netlify URLs issues

javascript

reactjs

netlify