ant design（一）
1、ant-design快速入手
官方文档：https://ant.design/docs/react/getting-started-cn
直接用下面的代码替换 index.js 的内容，用 React 的方式直接使用 antd 组件。
import React from 'react';
import ReactDOM from 'react-dom';
import { LocaleProvider, DatePicker, message } from 'antd';
// 由于 antd 组件的默认文案是英文，所以需要修改为中文
import zhCN from 'antd/lib/locale-provider/zh_CN';
import moment from 'moment';
import 'moment/locale/zh-cn';
moment.locale('zh-cn');
class App extends React.Component {
constructor(props) {
super(props);
this.state = {
date: '',
};
}
handleChange(date) {
message.info('您选择的日期是: ' + (date ? date.toString() : ''));
this.setState({ date });
}
render() {
return (
this.handleChange(value)} />
当前日期：{this.state.date && this.state.date.toString()}
);
}
}
ReactDOM.render(运行结果为：
2、安装antd遇到的问题：
npm install antd --save
改为：
npm install --save-dev antd
知识点补充：
--save-dev和--save的区别
使用npm来进行前端包管理的时候，我们会用到npm install或者cnpm install命令来安装需要用到的包资源
1: npm install *** --save-dev
2: npm install *** --save
我们通常会使用以上两种安装命令，而两者的区别在于：
当我们需要安装一些支持类的工具的时候，例如webpack，babel-loader之类时，我们希望用
npm install *** --save-dev 命令，该命令会使安装的包在package.json中的devDependencies:{***}中
当我们安装的是一些实际在项目代码中会用到的框架的时候，例如react，jquery，antd-design等，我们希望用
npm install *** --save 命令，该命令会使安装的包在package.json中的dependencies:{***}中
从package.json中的字段我们也可以理解为，但一些工具是在开发环境中才使用到的时候（在开发环境中我们会需要进行一些例如起本地服务，代理，转码，打包等操作），我们将其安装在devDependencies:{***}中
而对于在生产环境中同样会用到的工具框架（生产环境中已经是成熟的应用，所有的东西都应该是核心有效的），我们需要将其安装在dependencies:{***}中。
（当使用npm install --production的时候，只会安装dependencies:{***}中的项目。
3、npm安装教程（改变全局变量）
链接：https://www.cnblogs.com/goldlong/p/8027997.html
链接：https://blog.csdn.net/williamfan21c/article/details/55517558
注意，是在nodejs安装目录下，新建两个文件夹，node_global 和node_cache
不用重新装npm了，因为，nodejs安装的时候，就已经在node_module中生成了
4、引入React
import { 组件名称 } from 'antd'（比如import { Switch } from 'antd'）
5、在用react-app-rewired时，配置出现的问题
注意：config-overrides.js文件是在项目的根目录创建的 ，不是用的react-app-rewired根目录下 的config-overrides.js
另外更改package.json也是项目的。
改成：
会出现：
得完整：
结果为：
6、create-react-app脚手架中配置webpack的方法：
引自：http://www.mamicode.com/info-detail-2204275.html
create-react-app脚手架中的react-scripts能够
那么假如我们需要额外配置webpack该怎么办呢？比如添加md的loader。
我总结了2种方法，供以后开发时参考，相信对其他人也有用。
方法一
运行如下命令即可把配置文件显示出来：
npm run eject
//然后输入Y
输入后项目目录会多出一个congfig文件夹，里面就有webpack的配置文件。
但是此过程不可逆，所以显现回来后就不能再隐藏回去了。
方法二
(以修改babel插件实现按需加载antd为例，修改其它配置可以仿照这个方法来做。)
(1)使用 react-app-rewired （一个对 create-react-app 进行自定义配置的社区解决方案）和babel-plugin-import（一个babel的管理加载的插件）。
(2)修改package.json 里的启动配置。
(3)在项目根目录创建一个 config-overrides.js 用于修改默认配置。
7、npm安装module：
命令终端的当前路径：没有-g
在安装nodejs时，会把npm也安上；在node_module中。
所以安装别的模块时，要放到一个全局文件夹中，否则可能会在nodejs根目录下安装时，把原先生成的node_module覆盖掉。