React學習實例總結,包含yeoman安裝、webpack構建


1.安裝yeoman

在安裝nodeJs的基礎上,輸入命令:npm install -g yo grunt-cli bower,安裝yeoman,grunt,bowerify

安裝完成后,輸入命令:yo --version,查看當前yeoman的版本號 

yeoman官網地址:http://yeoman.io/

2.去http://yeoman.io/查看generator,安裝generator

輸入命令:npm install -g generator-react-webpack

3.安裝generator完后,輸入命令:npm ls -g depth=1 2>/dev/null | grep generator,查看webpack、react等的版本號

在windows系統下會報錯,【grep是Linux里面的命令,因此需要linux環境,windows可以用Git bash,gitbash里有MinGW,可以執行執行一些linux命令】

參考文檔:http://blog.csdn.net/esther_heesch/article/details/52972767

安裝git的方法:http://jingyan.baidu.com/article/90895e0fb3495f64ed6b0b50.html

git bash運行的結果:

 

4.安裝完git后,注冊github賬號,將github上新建的倉庫導到本地來

使用git bash命令工具,在你將要導出項目的文件夾內,右鍵Git Bash Here打開命令工具

輸入命令:git clone 新建倉庫的地址

運行完命令后,就可以看到在導出項目文件夾內多出了以github上倉庫名命名的項目文件夾

5.在命令行中輸入命令:cd gallery-by-react,進入gallery-by-react文件夾

輸入命令:yo react-webpack gallery-by-react,根據提示生成項目所需

運行完后的目錄:

6.運行完后發現缺少Gruntfile.js,這是由於generator-react-webpack V2.0 移除了Grunt(webpack替代)。可以執行 npm start 或者npm run serve 啟動服務

然后在網址上輸入http://localhost:8000/webpack-dev-server/,即可訪問

 


免責聲明!

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



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