天天看點

快速安裝create-react-app腳手架

快速安裝create-react-app腳手架

重新燃起激情來文章了,謝謝看我文章和關注我的讀者們

~基本上,做過工程化項目的前端er都知道,一般自己去搭建一個項目的準備工作是挺多的,關鍵還容易出錯,于是也就有了腳手架的出現。當然啦,在自己學習過程中還是建議自己去搭建項目的準備工作,具體開發的時候采用腳手架會更好。

vue有vue-cli,angularJS有angular-cli,而做react項目則有create-react-app這個腳手架。

今天主要來講下create-react-app的搭建,也是和vue-cli大同小異啦

create-react-app

安裝create-react-app

npm isntall -g create-react-app
           

安裝好了之後,看一下版本

create-react-app --version
           
快速安裝create-react-app腳手架

證明是安裝成功的。也有可能安裝敗,如果遇到安裝失敗的情況,可以評論留言一起交流啦~相信你的問題一定可以解決。

當然有,一點要注意的是,如果采用webpack打包項目的話,webpack已經更新為4.0的 webpack-cli,如果遇到用npm安裝失敗的話,有可能是webpack沒有更新導緻的問題。是以可以更新一下啦。

npm install -g webpack-cli -D
           

建立項目目錄my-app

安裝好了之後就直接建立my-app目錄,這個目錄是我們項目的根目錄,具體叫什麼名字,看具體需求啦

create-react-app my-app
           

慢慢等待安裝了

快速安裝create-react-app腳手架

安裝好了之後,接下來進入這個目錄,然後安裝依賴(腳手架都差不多)

cd my-app
           

我是直接指令行進入目錄的,如果你還不清楚指令行,就直接進入目前my-app檔案目錄再安裝依賴啦。

安裝依賴

npm install
           

接下來就是就像是集齊龍珠召喚神龍了,直接

npm start
           

項目跑起來的話,就用預設用你的3000端口打開建構的本地伺服器,如果你的3000端口被占用,就會用其他端口打開啦

快速安裝create-react-app腳手架

繼續閱讀