react第七天学习笔记

1.antd:是基于Ant Design设计体系的UI组件库:0

　　1)antd环境的配置:

　　　　　　先安装:npm i antd -S,然后在安装react-app-rewired customize-cra babel-plugin-import,然后在根目录下新建config-overrides.js,里

　　　　　　const { override, fixBabelImports } = require('customize-cra');

　　　　　　module.exports = override(

　　　　　　　　　　　　　　　　fixBabelImports('import', {  libraryName: 'antd',  libraryDirectory: 'es',  style: 'css',  }),  

　　　　　　　　　　　　);

　　2)将ui组件环境语言设为中文:

　　　　　　import zhCN from 'antd/es/locale/zh_CN';

　　　　　　import LocaleProviderfrom 'antd'

　　　　　　return ( <LocaleProviderlocale={zhCN}> <App /> </LocaleProvider> );

　　3)配置less  less-loader和addLessLoader      配合设置样式风格

　　　　　　addLessLoader({javascriptEnabled:true,modifyVars:{'@primary-color':'#1DA57A'},}),

2.使用react-rewired配置基本的环境

　　1)先安装react-app-rewired customize-cra

　　2)将package.json中将react-app 换成 react-app-rewired

　　3)然后安装less less-loader,然后在config-overrides.js(自己创建)中配置

　　4)然后配置antd的运行环境,安装antd和babel-plugin-import

　　5)在npm网站中搜索customize-cra中的addDecoratorsLegacy    还需安装这个 @babel/plugin-proposal-decorators    配置装饰器

3.ctrl+d，这个命令初次使用时会选中附近的单词，而第二次使用时会向下搜索并相中相同的一个单词，如果这个单词在最后面则会向问首搜索，依次类推。

4.ctrl+shif+l或ctrl+f2,在全文相同的单词后面添加光标。这个命令比 f2 修改变量名使用范围更广。

　　　　　　

　　　　　　　　　　　　

LocaleProvider