1.React有create-react-app,这种脚手架的方式好处很明显,支持ES6新增语法、api,每次保存自动更新改变的内容(不用再每次手动关闭重启Node服务器),因此弄出脚手架:node
命令以下:react
$ npx create-react-app 文件名
$ cd 文件名
$ npm start
便可运行
2.脚手架引入typescript。(让代码更严谨,反正我暂时不须要,之后要看)
typescript是什么?
typescript其实就是一种(由微软开发的自由和开源的)编程语言,它是JavaScript的一个超集,并且本质上向这个语言添加了可选的静态类型和基于类的面向对象编程。
typescript有什么用?能作什么?
一、编译时的强类型【TypeScript设计了一套类型机制来保证编译时的强类型判断。】
说人话:你能够申明变量的类型,typescript强大的强类型在编译器检验的时候,那么任何其余类型的赋值将会引发编译错误,而咱们此时只要根据报错改掉相应的参数便可。
强类型还有一个最大好处就是智能提示,例如你能够知道当前变量具备哪些属性和方法,这样就会很方便。
(我以为就是智能提示及检验变量类型)
二、模块化
(我理解的是TypeScript的关键词module能够合并也能够经过符号‘.’被嵌套,也能够经过export的对象外部调用)typescript
三、已有的类库能够很方便的使用
相似于C的头文件,TypeScript容许你定义一些声明,声明已有的变量和类型,那么你能够很方便的用强类型的方式去调用已有的类库。
react项目引入TypeScript
0.0792019.03.12 10:28:37字数 113阅读 1,354
使用create-react-app脚手架进行搭建。npm
1、首次安装create-react-app(若是以前安装过能够跳过这一步)
yarn global add create-react-app
或者npm install -g create-react-app
编程
2、 使用create-react-app构建TypeScript项目
create-react-app demo02 --typescript
3、已构建react项目引入TypeScript
npm install --save typescript @types/node @types/react @types/react-dom @types/jest 或者 yarn add typescript @types/node @types/react @types/react-dom @types/jest
注意:
ts文件后缀名只对类型定义若是代码中含有dom元素jsx之类的须要改成tsx文件后缀名。api