Question

我有一个使用create-react-app构建的React应用，它使用react-router。当我使用npm start打开测试开发视图时，一切都运行得很好。但是，当我构建应用时 - 无论我将homepage中的package.json字段设置为 - 我得到的是#root div，其中包含react-empty: 1条评论。

我的index.js组件如下所示：

ReactDOM.render(
    (<Router history={browserHistory}>
        <Route path="/" component={App}>
             <IndexRoute component={Home} />
             <Route path="/news" component={News} />
             <Route path="/current" component={Current} />
             <Route path="/previous" component={Previous} />
             <Route path="/about" component={About} />
             <Route path="/enter" component={Enter} />
             <Route path="/login" component={Login} />
             <Route path="/profile" component={Profile} />
        </Route>
     </Router>),
     document.querySelector('#root')
 );

如果您需要查看更多代码以了解发生了什么，请告诉我。重申一下 - 在npm test或应用程序的构建副本中都没有出现任何错误。

Answer 1

这是homepage中package.json的相对路径和路线定义的问题。

Router如果必须呈现，则会呈现null之类的内容。

您已将集Route path="/"设置为匹配主页中的相对路径。

您可以将其更改为

<Route path=process.env.PUBLIC_URL component={App}>

这将采用您在package.json

中作为主页提供的内容

create-react-app应用程序在npm start中呈现，但在npm build中只显示react-empty：1

1 个答案: