React开发笔记

项目环境搭建

　　使用create-react-app

CSS使用styled-components

　　yarn add styled-components

引入reset.css样式

　　import { createGlobalStyle } from 'styled-components'

　　export const GlobalStyle = createGlobalStyle ` `

　　然后在App.js中引入GlibalStyle组件

引入iconfont

　　配置跟reset.css一样

引入react-transition-group

 　　实现组件动画效果

引入redux  react-redux

　　如何配置 首先创建store 文件夹   index.js   reducer.js只一个纯函数

　　然后App.js引入Provider  store

　　接着在组件中使用connect做连接    connect（mapStateToProps, mapDispathcToProps）(Header)

使用redux-devtool-extension插件

　　https://github.com/zalmoxisus/redux-devtools-extension

　　如何使用　

  import { createStore, applyMiddleware, compose } from 'redux';

+ const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
+ const store = createStore(reducer, /* preloadedState, */ composeEnhancers(
- const store = createStore(reducer, /* preloadedState, */ compose(
    applyMiddleware(...middleware)
  ));