一个 React & Redux的目录树

|-----------------------------------------|
|                                         | 
|            React & Redux                |
|                                         | 
|-----------------------------------------|

Project
  |
  |-- node_modules 
  |       |
  |       |-- react
  |       |
  |       |-- react-dom
  |       |
  |       |-- react-router
  |       |
  |       |-- react-redux => redux本身只能处理同步的Action
  |       |
  |       |-- react-thunk => 在我们没有加上thunk这个中间件之前，
  |       |                  store的dispatch方法只能传入一个action对象，
  |       |                  thunk的作用就是能够让我们可以将一个function方法传入diptach，
  |       |                  这在做异步的时候非常有用。
  |       |
  |       |-- redux-promise => redux-promise支持将promise对象作为参数传入dispatch中。
  |       |
  |       |-- prop-types => React.PropTypes 自 React v15.5 起已弃用。
  |       |                 请使用 prop-types 库代替。调用方法：
  |       |                 import PropTypes from 'prop-types'
  |       |
  |       |-- @types/react => implements method in React.Component,解决
  |       |                   Cannot resolve symbol 'Component' 的问题
  |       |
  |       |-- postcss-loader => PostCSS，一款通过 JS 插件转换 styles 样式的工具。
  |       |                     根目录下新建postcss.config.js文件。配置如下：
  |       |                     module.exports = {
  |       |                         parser: 'sugarss',
  |       |                         plugins: {
  |       |                            'postcss-import': {},
  |       |                            'postcss-cssnext': {},
  |       |                            'cssnano': {}
  |       |                         }
  |       |                     }
  |       |                     webpack配置：{
  |       |                                   test: /\.css$/,
  |       |                                   use: ['style-loader', 'css-loader','postcss-loader']
  |       |                                 }
  |       |
  |       |-- Autoprefixer => PostCSS插件，一个后处理程序。解析CSS并添加浏览器前缀。
  |       |                     postcss.config.js文件中配置如下：
  |       |                     module.exports = {
  |       |                         plugins: [
  |       |                            require('autoprefixer')({})
  |       |                         ]
  |       |                     }
  |       |
  |       |-- extract-text-webpack-plugin => 将css单独打包成一个文件。
  |       |                                  它会将所有的入口 chunk(entry chunks)中引用的 *.css，
  |       |                                  移动到独立分离的 CSS 文件。因此，你的样式将不再内嵌到JS bundle中，
  |       |                                  而是会放到一个单独的 CSS 文件（即 styles.css）当中。 
  |       |                                  如果你的样式文件大小较大，这会做更快提前加载，因为 CSS bundle 
  |       |                                  会跟 JS bundle 并行加载。
  |       |
  |       |-- optimize-css-assets-webpack-plugin => 压缩抽离后的css代码,
  |       |                                         plugins: [new OptimizeCssAssetsPlugin()]
  |       |
  |       |-- html-webpack-plugin => 该插件将为您生成一个HTML5文件，
  |       |                          其中包括使用script标签的body中的所有webpack包。
  |       |
  |       |-- copy-webpack-plugin => 在webpack中拷贝文件和文件夹。例如：
  |       |                          new CopyWebpackPlugin([
  |       |                           {from: "./src/static/images", to: 'images/'}
  |       |                          ])
  |       |                          作用就是将 ./src/static/images 
  |       |                          目录下的图片拷到编译目录到 images 文件夹下面
  |       |
  |       |-- rimraf => 编译前清空dist目录。package.json配置：
  |       |             "scripts": {"build": "rimraf dist && ..."}
  |       |
  |       |-- OpenBrowserPlugin => webpack编译后自动打开浏览器
  |       |
  |       |-- axios => 一个基于 promise 的 HTTP 库，可以用在浏览器和 node.js 中
  |       |
  |       |-- babel-eslint => 一个Babel parser的包装器，这个包装器使得Babel parser可以和ESLint协调工作
  |       |                   .eslintrc.js中配置："parser": "babel-eslint",
  |       |                                      "parserOptions": {
  |       |                                          "sourceType": "module",
  |       |                                          "allowImportExportEverywhere": false,
  |       |                                          "codeFrame":