这是开始使用单页React应用程序的一种快速而简单的方法，我希望它会受欢迎，因为它已经在不到一天的时间内在GitHub上获得了超过2000颗星！

重点是零配置，让您专注于编写应用程序。作为一个喜欢整个Babel / Webpack配置舞蹈的人来建立一个新项目，我仍然认为这很神奇，因为在开始一个新项目时我很容易陷入“分析瘫痪”。这允许您刚刚开始，当分支出来并添加更多配置时，您可以运行npm run eject它，然后它将公开以前隐藏的Webpack / Babel / ESLint配置。

由于注重简洁性，目前缺少一些非常好的东西。我认为最大的一个是热模块更换（HMR）。如果没有页面重新加载，您的应用程序可以立即在浏览器中重新渲染，从而大大提高了工作效率。它目前正在为CSS工作，但尚未启用React组件。但您可以通过更新您的启用它index.js来看起来像这样： 

import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';
import './index.css';
const rootEl = document.getElementById('root');

ReactDOM.render(
  <App />,
  rootEl
);

if (module.hot) {
  module.hot.accept('./App', () => {
    const NextApp = require('./App').default;
    ReactDOM.render(
      <NextApp />,
      rootEl
    );
  });
}

这将只使用Webpack的HMR随时重新呈现您的应用程序App.js（或者它的依赖树中的文件）。

看看Create React App并开始提交一些反馈，因为我认为这是让更多人对使用之前被吓跑的React感兴趣的好机会。

搭配Redux（redux状态值不丢失）

import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import * as serviceWorker from './serviceWorker';
import { Provider } from 'react-redux';
import configureStore from './redux/store/configureStore';
const store = configureStore();

const rootEl = document.getElementById('root');

ReactDOM.render(
  <Provider store={store}>
  <App />
</Provider>,rootEl);

if (module.hot) {
  module.hot.accept('./App', () => {
    const NextApp = require('./App').default;
    ReactDOM.render(
      <Provider store={store}>
        <NextApp/>
      </Provider>,
      rootEl
    );
  });
}
// If you want your app to work offline and load faster, you can change
// unregister() to register() below. Note this comes with some pitfalls.
// Learn more about service workers: http://bit.ly/CRA-PWA
serviceWorker.unregister();