react常用安装命令

一.创建react项目

1.npm i create-react-app -g

2. create-react-app react-youzan(项目名称)

3创建后第一步使用eject

4.git init

5.git add .

6 git commit '做了什么'

7 npm run eject

二.路由：

npm i react-router-dom -S

三.mobx

安装：npm install mobx -S

将react与mobx链接起来

    npm install mobx-react -S

四.eslint

使用两个 Babel 插件，支持ES6装饰器语法

  npm install @babel/plugin-proposal-decorators -D

  npm install @babel/plugin-proposal-class-properties -D

在 json文件中的babel 中配置如下

{

  <!-- "presets": ["@babel/preset-react"], -->

  "plugins": [

    ["@babel/plugin-proposal-decorators", {"legacy": true}],

    ["@babel/plugin-proposal-class-properties",{"loose": true}]

  ]

}

五.sass

安装：npm i node-sass -D

六.antd-design

安装：npm i antd -S

APP.js引入样式:import 'antd/dist/antd.css'

七.axios
安装：npm i axios -S
八.rem
1.配置rem
public=>rem.js=>在index.html引入
<script src="./rem.js"></script>

function resetRootFZ(){
    var oHtml = document.querySelector('html');
    var w = oHtml.getBoundingClientRect().width;
    // 设置根字体的大小等于html节点的宽度的十分之一
    oHtml.style.fontSize = w/10 + 'px';
  };
  
  resetRootFZ();
  
  // 当window窗口尺寸变化时，重新设置根字体的大小
  window.addEventListener('resize',function(){
    resetRootFZ();
  });

九.moment 时间戳
安装：npm i moment -S
十.redux
安装：npm i redux -S
十一.中间件 （applyMiddleware）
解决异步数据·问题
安装： npm i redux-thunk -S
引入到reducer文件中

        import ReduxThunk from 'redux-thunk'

十二.代理配置
1 安装http-proxy-middleware： npm install http-proxy-middleware --save
2 创建src/setupProxy.js

const proxy = require('http-proxy-middleware');
module.exports = function(app) {
    app.use(
        '/soso',
        proxy({
          target: 'https://c.y.qq.com',//此处设置想要链接的url
          changeOrigin: true,
        })
      )
}