Question

我刚刚开始与react-create-app做出反应。我已经制作了一个小应用程序，并且知道我在不同部分拆分网站时遇到了麻烦。

我为html5游戏制作了一个网站。我做了一个快速原型的应用程序（玩家可以看到其他连接的玩家，开始游戏等）。例如，为了获得连接的播放器，我只使用axios从JAVA spring服务器获取数据。

但是，我想在此应用程序之前创建一个欢迎/登录页面。 Like this 这个页面只是＆＃34;看看这个很酷的游戏，立即注册！＆＃34;

我应该怎么做才能做出反应？我应该使用React Router吗？也许以后我想添加一个DevBlog？也许论坛？ ...我不希望有人想看到devblog从论坛下载所有资产。

如何轻松扩展我的小应用程序？

我迷失了自己，似乎有很多方法！创建一个parallels节点服务器？使用服务器端呈现？ NextsJS？ Redux？路由器？

对于独自工作的人来说，最佳选择是什么？

Answer 1

您可以使用react-router和称为异步路由的东西。 Webpack允许您使用require.ensure为每条路线创建多个分割点。

当用户输入某个路径时，您最终会以多个（尽可能多的数量）文件进行异步下载，而不是拥有一个巨大的js / css文件。

import { injectReducer } from '../../store/reducers'

export default (store) => ({
  path : 'forum',
  /*  Async getComponent is only invoked when route matches   */
  getComponent (nextState, cb) {
    /*  Webpack - use 'require.ensure' to create a split point
        and embed an async module loader (jsonp) when bundling   */
    require.ensure([], (require) => {
      /*  Webpack - use require callback to define
          dependencies for bundling   */
      const Counter = require('./containers/ForumContainer').default
      const reducer = require('./modules/forum').default

      /*  Add the reducer to the store on key 'forum'  */
      injectReducer(store, { key: 'forum', reducer })

      /*  Return getComponent   */
      cb(null, Forum)

    /* Webpack named bundle   */
    }, 'forum')
  }
})

所以使用上面的配置，当有人进入yourawesomepage.com/forum时，下载了必要的文件，并且负责论坛的reducer（来自redux）也被注入。

This是一个小小的初学者包，开箱即用。

React - 如何处理多个零件网站？如何扩展react-app？

1 个答案: