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