今天，開始學習第二節！！！ 工欲善其事，必先利其器 react推薦我們使用webpack來打包文件，那麼我們就用吧！（其實真心不想用啊） 至於好處網上寫的天花亂墜的，大家自行解決啊... 這節主要就學習怎麼配置webpack了，這玩意我搗鼓了整整一天才弄的一知半解，哎，腦子差就是吃虧... 1.提前 ...
今天，開始學習第二節！！！
工欲善其事，必先利其器
react推薦我們使用webpack來打包文件，那麼我們就用吧！（其實真心不想用啊）
至於好處網上寫的天花亂墜的，大家自行解決啊...
這節主要就學習怎麼配置webpack了，這玩意我搗鼓了整整一天才弄的一知半解，哎，腦子差就是吃虧...
1.提前準備工作
（ps：自己裝好node啊，別怪我沒提醒你）
首先，你需要有一個自己的文件夾，至於什麼名字你自己看著辦，我的叫做 reactdemo
裡面放一個測試的html加一個js文件夾
2.安裝
2.1
點擊win+r，輸入cmd進入控制台，然後進入自己的目錄
輸入npm init
裡面的東西一路回車就好
然後進入你的文件夾裡面看是不是多了個package.json的文件
2.2
ok，現在我們先來一發全局安裝。
繼續輸入npm install -g webpack
然後默默等待...
2.3
現在可以配置webpack了，這個要下的東西比較多，網速不好者默哀吧（我整整用了2個小時 - -！）
Style-loader載入器
輸入npm install style-loader --save-dev
(載入器部分就不在上圖了啊，因為剛裝過，在裝一遍太浪費時間了，不好意思啊，原諒我的懶惰吧)
css-loader載入器
輸入npm install css-loader --save-dev
jsx-loader載入器
輸入npm install jsx-loader --save-dev
之後局部安裝webpack
輸入npm install webpack --save-dev
成功後你的文件夾變身成為這個樣紙：
3.使用
這個用之前，還要創建一個webpack.config.js的文件，這個文件呢，就是告訴webpack你要做什麼，這裡是個demo，所以裡面就寫簡單點（多了的我還沒搞懂呢，哼！）
終於到能用的時候了，想想內心還是有點小激動的呢！
噹噹噹噹，成功啦...
這時候你的文件夾成了這個樣紙：
webpack自動幫我們生成了build文件夾，裡面有個build.js...
然而我的html里也不用再引入index.js，直接引入build.js就可以了...
這樣基本就都差不多了
另外我自己在用的時候還遇見過出現不是內部命令（好像是叫這個，大家懂就好啦）這個錯誤，這裡將解決方法也貼出來好了
一般這種情況是因為環境變數的問題
我們通過按win+Pause進入
選擇我畫的那個，點擊這個：
進入後：
點擊編輯或者雙擊將路徑添加進去。
這個時候聰明的寶寶就會問路徑在哪啊？額，疏忽了，這個你們看完路徑可能要從上面再來一遍。
路徑：
接著進入：
找到webpack.cmd：
反正我的在這裡，別人的是不是我還真不知道。
複製這個：
好啦，這個就是路徑啦，添加到上面說的環境變數里，就OK啦！！！
結尾名言：不存在十全十美的文章，如同不存在徹頭徹尾的絕望。
（上一章被GM鄙視了，說不是技術文章，不讓放首頁，確實我很菜，但也不用這樣吧！！！氣煞我也；氣煞我也；氣煞我也...）
參考資料：webpack官方網站 http://webpack.github.io/
30分鐘手把手教你學webpack實戰 http://www.th7.cn/web/html-css/201509/120709.shtml（這個大大寫的確實挺好，最起碼不會雲里霧裡的，像我這種智商的都能看懂）
