React 教程
React 是用于构建用户界面的 JAVASCRIPT 库
React用于构建UI,是 MVC 中的 V(视图)
React 源于 Facebook 内部项目,架设 Instagram 的网站,2013 年 5 月开源
React 高性能,代码逻辑简单,越来越多的人已开始关注和使用
React 特点
1.声明式设计 −React采用声明范式,轻松描述应用。
2.高效 −React通过对DOM的模拟,减少与DOM的交互
3.灵活 −React与已知的库或框架很好地配合。
4.JSX − JSX 是 JavaScript 语法的扩展。React 开发不一定使用 JSX ,但建议使用
5.组件 − 通过 React 构建组件,使得代码更加容易得到复用,能够应用在大项目的开发中
6.单向响应的数据流 − React 单向响应的数据流,减少重复代码,比传统数据绑定更简单
阅读本文前,您需要了解的知识:
在开始学习 React 之前,您需要具备以下基础知识:
HTML5
CSS
JavaScript
React 第一个实例
在线编辑实例,然后点击按钮查看结果。
https://g.alicdn.com/code/lib/react/16.8.6/umd/react.production.min.js
https://github.com/facebook/react/releases
本文 React 版本 16.4.0,官网 https://reactjs.org/ 下载最新版
React 实例
<div id="example"></div><script type="text/babel">ReactDOM.render(<h1>Hello, world!</h1>,
document.getElementById('example')
);</script>
尝试一下 »
千年的回眸
Yarn由Facebook、Google、Exponent 和 Tilde 联合推出 JS 包管理工具
Yarn 是为了弥补 npm 的一些缺陷而出现的
Install via npm
It is recommended to install Yarn through the npm package manager, which comes bundled with Node.js when you install it on your system.
Once you have npm installed you can run the following both to install and upgrade 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 # 清除缓存
大王叫我来巡山1998