React 学习笔记1.速度快 2. 更安全 3.更可靠 const：声明一个只读的常量，一旦声明常量值不可修改。但是如

新建 react 工程

1. npx create-react-app project
2. cd project
3. yarn eject
4. yarn build
5. delete whole node_modules
6. yarn start

新建 react 工程 issue

NPM的使用

// 查看当前 npm 源配置
$ npm config ls
// 修改 npm 源地址为官方源
$ npm config set registry https://registry.npmjs.org/
// 将 npm 源地址修改为淘宝源（用于安装 npm 速度慢的时候使用）
$ npm config set registry  https://registry.npm.taobao.org/

// 登录命令
$ npm login
// 退出登录命令
$ npm logout

添加注册用户(前提是已经注册过了)
$ npm adduser  
推包到npm上
$ npm publish  
//删除包
$ npm publish [包名] -force 

//安装包 -g 全局安装
$ npm install [包名] -g

yarn 的使用

概念和npm一样，也是前端包管理器
特点 1.速度快 2. 更安全 3.更可靠
yarn的安装: yarn使用官网

//使用npm全局安装  
npm install yarn -g 
//全局升级
npm upgrade yarn -g
//版本检查
yarn --version
yarn -v

Yarn 淘宝源安装，分别复制粘贴以下代码行到黑窗口运行即可
yarn config set registry https://registry.npm.taobao.org -g
yarn config set sass_binary_site http://cdn.npm.taobao.org/dist/node-sass -g
yarn的常用命令：
安装yarn

npm install -g yarn
安装成功后，查看版本号：

yarn --version
创建文件夹 yarn

md yarn
进入yarn文件夹

cd yarn
初始化项目

yarn init // 同npm init，执行输入信息后，会生成package.json文件
yarn的配置项：

yarn config list // 显示所有配置项
yarn config get <key> //显示某配置项
yarn config delete <key> //删除某配置项
yarn config set <key> <value> [-g|--global] //设置配置项
安装包：

yarn install //安装package.json里所有包，并将包及它的所有依赖项保存进yarn.lock
yarn install --flat //安装一个包的单一版本
yarn install --force //强制重新下载所有包
yarn install --production //只安装dependencies里的包
yarn install --no-lockfile //不读取或生成yarn.lock
yarn install --pure-lockfile //不生成yarn.lock
添加包（会更新package.json和yarn.lock）：

yarn add [package] // 在当前的项目中添加一个依赖包，会自动更新到package.json和yarn.lock文件中
yarn add [package]@[version] // 安装指定版本，这里指的是主要版本，如果需要精确到小版本，使用-E参数
yarn add [package]@[tag] // 安装某个tag（比如beta,next或者latest）
//不指定依赖类型默认安装到dependencies里，你也可以指定依赖类型：

yarn add --dev/-D // 加到 devDependencies
yarn add --peer/-P // 加到 peerDependencies
yarn add --optional/-O // 加到 optionalDependencies
//默认安装包的主要版本里的最新版本，下面两个命令可以指定版本：

yarn add --exact/-E // 安装包的精确版本。例如yarn add foo@1.2.3会接受1.9.1版，但是yarn add foo@1.2.3 --exact只会接受1.2.3版
yarn add --tilde/-T // 安装包的次要版本里的最新版。例如yarn add foo@1.2.3 --tilde会接受1.2.9，但不接受1.3.0
发布包

yarn publish
移除一个包

yarn remove <packageName>：移除一个包，会自动更新package.json和yarn.lock
更新一个依赖

yarn upgrade 用于更新包到基于规范范围的最新版本
运行脚本

yarn run 用来执行在 package.json 中 scripts 属性下定义的脚本
显示某个包的信息

yarn info <packageName> 可以用来查看某个模块的最新版本信息
缓存

yarn cache
yarn cache list # 列出已缓存的每个包 yarn cache dir # 返回 全局缓存位置 yarn cache clean # 清除缓存

react 中 import

import defaultcomponent,{a,b,c...} from 'XXX'
eg: import React,{Component} from 'react';
导入‘react’文件里export的一个默认的组件，将其命名为React以及Component这个非默认组件

import defaultcomponent form 'XXX'
导入XXX文件中的默认组件，命名为defaultcomponent

import {a} from 'XXX'
导入XXX文件中的a组件

import {a as b} from 'XXX'
导入XXX文件中的a组件，并将其重命名为b

import * as a from 'XXX'
导入XXX文件中的所有组件，并将其命名为a，调用具体组件的方式为a.b、a.c。。。但不包含默认组件

script 手动导入组件

<script src="/node_modules/react/umd/react.development.js">

脚手架使用

npm install -g create-react-app
yarn add -g create-react-app
create-react-app react-demo

React Hooks

函数组件没有作用域

useState : 类似于状态组件中的state
useEffect : 类似状态组件的生命周期

路由Hooks

useParams
useHistory

let 和 const区别

let：与var类似，但是作用域只在当前代码块内部
const：声明一个只读的常量，一旦声明常量值不可修改。但是如果修饰的是一个对象，那么对象本身可以变化，指针地址不可变

let array = []
array.push('bao');//可执行，因为指针没有变
array = ['lee'];//报错，因为指针变了

alias

alias 其实就是别名。某个命令很长，可以用使用alias别名来减少命令输入。eg：

g=git
ga='git add'