React

• 安装：
  脚手架 create-react-app
  脚手架全局安装：

   yarn add create-react-app -g -----没验证通过 安装没问题 但是create-react-app提示不识别
  // 公司是苹果笔记本 用npm安装成功了 命令如下
   sodu npm install -g create-react-app
  

  不全局安装

   npx create-react-app 项目名 
  

• 修改配置
  因为内置了配置，如果想修改配置文件，比如要支持less,则需修改默认配置。运行npm run eject 用来暴露配置文件的命令。首次运行会报错，提示文件没有被git追踪，操作不可逆。只要

  git add .   
  git commit -m ''
  

  即可。然后继续npm run eject，可以看到下载很多文件，并修改了package.json。控制台的提示命令中，都有说明。然后可以通过config/webpack.config.js修改配置。里面内置了sass，可以按照sass配置一份less。

• JSX
  babel-preset-react 把react JSX编译。要不然，直接createElement('h1','属性',儿子节点) 如果嵌套很深，写起来很恶心。可以在这个地址上，查看编辑后对应的react语法。https://babeljs.io/repl/

• 使用：

  react的组件都是函数 包括function函数组件(静态组件) 和 class类组件

  类组件写法：

  export class HelloWorld extends React.Component{
    render(){
      return <h1>a</h1>
    }
  }
  

  类组件用的时候，页面头部必须引入react。

  可以通过这个插件，省去在每一个组件中都要引入react

  webpack.ProvidePlugin({ 
     identifier:['module1'] 
  })
  

  注意：react组件在使用时，首字母必须大写。如果没有大写，下面为报错提示：

  Warning: The tag <app> is unrecognized in this browser. If you meant to render a React component, start its name with an uppercase letter.
  

  行内样式的写法 必须style={对象} 如：let obj={color:'red'} style={obj}

  直接些html：
  vue:v-html="" react:dangerouslySetInnerHTML={{__html:<div>aaa</div>'}}

  class 对应要用className

• 模拟JSX
  学习笔记 路径为：src/selfJsx.js

• 路由
  react-router-dom

• 全局数据
  redux react-redux

• 模型：MVC
  MVC 数据是单向的。数据通过controller更改视图，视图没法通过controller更改数据，需要在数据层获取视图层的东西，然后手动更新视图。

Vue

• 安装：
  脚手架 vue-cli
• 修改配置
  新建vue.config.js 可以在其中修改覆盖默认的。 同样可以通过命令查看默认配置

  vue-cli-service inspect
  

  官网参考地址
• 路由
  vue-router
• 全局数据
  vuex
• 模型MVVM
  M-V-VM(ViewModel)。数据自动更新，双向的。