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

Question

我有一个使用 create-react-app 构建的 React 应用程序，它使用 react-router。当我使用 npm start 打开测试开发视图时，一切正常。但是，当我构建应用程序时——无论我将 package.json 中的 homepage 字段设置为什么——我得到的只是带有 react-empty: 1 注释的#root div .

我的 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

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

Router 将呈现类似于  的内容，如果它必须呈现 null.

您已经设置了 set Route path="/"，这应该与主页中的相对路径相匹配。

您可以将其更改为

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

这将采用您在 package.json

中提供的主页

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

create-react-app application renders in npm start, but shows only react-empty: 1 in npm build

reactjs

react-router

create-react-app