react-route

hash 部分（指的是 # 后的部分）
如#/inbox

如果需要在 Home 路由被渲染后才激活的指向 / 的链接，请使用<IndexLink to="/">Home</IndexLink>

/ 首先我们需要导入一些组件…

import { Router, Route, Link } from 'react-router'

<Link to="/about">About</Link>

{this.props.children}

import React from 'react'
import { render } from 'react-dom'
import { browserHistory, Router, Route, IndexRoute } from 'react-router'

import App from '../components/App'
import Home from '../components/Home'
import About from '../components/About'
import Features from '../components/Features'

render(
  <Router history={browserHistory}>
    <Route path='/' component={App}>
      <IndexRoute component={Home} />
      <Route path='about' component={About} />
      <Route path='features' component={Features} />
    </Route>
  </Router>,
  document.getElementById('app')
)

一个 history 知道如何去监听浏览器地址栏的变化，
并解析这个 URL 转化为 location 对象，
然后 router 使用它匹配到路由，最后正确地渲染对应的组件。

---

常用的history三种形式
browserHistory
hashHistory
createMemoryHistory

可以从 React Router 中引入它们：

// JavaScript 模块导入（译者注：ES6 形式）
import { browserHistory } from ‘react-router’

然后将它们传递给:

render(
,
document.getElementById(‘app’)
)

---

browserHistory
Browser history 是使用 React Router 的应用推荐的 history。它使用浏览器中的 History API 用于处理 URL，创建一个像example.com/some/path这样真实的 URL 。

---

hashHistory
Hash history 使用 URL 中的 hash（#）部分去创建形如 example.com/#/some/path 的路由。

---

createMemoryHistory
Memory history 不会在地址栏被操作或读取。这就解释了我们是如何实现服务器渲染的。

---

React Router 里的路径匹配以及组件加载都是异步完成的，不仅允许你延迟加载组件，并且可以延迟加载路由配置。

webpack 这类的代码分拆工具使用
https://webpack.js.org/

---

REQUIREJS
添加 require.js 到 scripts 目录
在 main.js, 你可以使用 require() 来加载所有你需要运行的scripts. 这可以确保你所有的scripts都是在这里加载的

require('./expample.js).default
require 可以动态加载，也就是说你可以通过判断条件来决定什么时候去 require

补充:
最后，require和require.default…当在node中处理ES6 模块(export default mycomponent)导入的时候，导出的模块格式为

{ "default": mycomponent }
import 语句正确地为你处理了这个问题，然而你必须自己执行
require("./mycomponent").default. HMR(热更新模块)不在 inline模式工作的情况下，接口代码不能使用 import ，如果你想避免，使用module.exports而不是export default;

上文提到过，export 关键字是导出一个对象，对象内存在一个属性(我们要暴露的)，export default 则是 export
语法糖，import 一个export default
暴露出来的模块包含了解构赋值的步骤，所以在node中使用require去请求一个export
default的模块需要我们通过.语法去取出对象中的属性(因为require木有解构赋值)，清晰明了。

换个说法，如果 require 的 commonjs规范的模块，即： 导出：

// a.js 
module.exports = {   
a:'helloworld' 
} 

导入：

// b.js 
var m = require('./a.js');
 console.log(m.a); // helloworld

这样就显得非常清晰，我们 module.exports 的是啥，require 的就是啥。