前端新手如何安裝webstorm ,初步搭建react項目


下載安裝webstorm:配置成功:

配置成功后就可以開啟webstorm項目了。(存微信收藏、、)

1:在webstorm下配置node環境:

2:完成之后:

React官方腳手架地址:

https://github.com/facebook/create-react-app

在終端下安裝執行npm install -g create-react-app  不用每個項目都裝。一個webstorm裝一次即可

3:可以直接新建react app項目了。

 

4:如上圖:自己安裝完成之后:執行下 npm list -depath0      (查看所下載的不為空的依賴包)

或者 npm ls (查看所下載的所有的依賴包包括空文件)

 完成並開啟入口

5:最后可以自己完成自己react項目

 

注意的是:一定要有頂層包裹的元素:如果不是報錯

如下圖:

 

6:初始化:

新建一個component文件夾下。並建一個header.js  如下圖:按鈕控制內容的顯隱性  

縮寫的class后面的類 Header 一定的要大寫、  如果需要導出到其它地方引用必須   export default這個類

7:引用導出的組件

7:

 8:最終結果

 9:項目完成之后打包上線。運行yarn build  上傳的文件大致如下圖所示。。具體情況具體分析


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM