最新create-react-app配置

1.新建create-react-app my-react

2.npm run eject暴露配置文件

3.配置less
npm run less less-loader -D
具体参照 www.cnblogs.com/fangdongdem…
4.配置热加载 npm 安装"react-hot-loader"，"babel-plugin-import"，
.babelrc文件
{ "presets": ["react-app"],
"plugins":[
["import", {"libraryName": "antd", "style": true}],
["react-hot-loader/babel"]
]
}
5.配置路由
(1)准备工作：安装react-router-dom

npm install react-router-dom --save // --save 会把依赖包名称添加到 package.json 文件 dependencies 键下,运行时依赖

(2).在src文件夹下创建components文件夹，用来存放组件。例如我的是这样的

(3).在路由配置文件index.js中依次导入要使用的组件以及路由需要使用的组件。如我的配置是这样的： 

import React, { Component } from 'react';
import ReactDOM from 'react-dom';
import {
    BrowserRouter as Router,
    Route,
    Link
}from 'react-router-dom';
import './index.css';
import App from './components/App';  // 导入App组件
import About from './components/About'; // 导入About组件
import Inbox from './components/Inbox'; // 导入Inbox组件
import registerServiceWorker from './registerServiceWorker';
 
export default class Hello extends Component{
    render(){
       return (
            <Router>
                <div>
                <ul className="nav">
            &emsp;&emsp;&emsp;&emsp;&emsp;&emsp;<li><Link to="/">App</Link></li>
            &emsp;&emsp;&emsp;&emsp;&emsp;&emsp;<li><Link to="/About">About</Link></li>
            &emsp;&emsp;&emsp;&emsp;&emsp;&emsp;<li><Link to="/Inbox">Inbox</Link></li>
        &emsp;&emsp; &emsp;&emsp;&emsp;&emsp;</ul>
                    <hr />
                    <Route exact path="/" component={App} />
                    <Route path="/About" component={About} />
                    <Route path="/Inbox" component={Inbox} />
                </div>
            </Router>
        )
    }
}
ReactDOM.render(<Hello />, document.getElementById('root'));
registerServiceWorker();

其中exact是用来”/”做唯一的匹配。如果没有这个的话，在匹配其他的同时也会匹配到当前