使用webpack打包React.js 專案

上一篇我們終於在server 上把React.js 跑起來之後,就能繼續寫下去, 結果很快的我們就遇到另一個問題,那就是怎麼所有code 都擠在一塊了(yay,

我們上一篇解法的問題,在於我們template render 這個網頁之後,相關的檔案全塞在用 <script>引入的javascript 檔案裡, 然後這個文件就引不入其他文件了,而React 提倡的模組化該是能把各元件分別歸檔才是。
幸好,我們還是有解法的,利用webpack 讓我們把檔案分開,然後用webpack 打包成單一的 javascript 檔案,據說這種寫法就是入坑,9 因為一用了webpack 就脫不了身,之後都會綁死在webpack 上面。
網路上有些相關的文件,就來一步步跟著做:

...

使用bower安裝react 前端環境

最近寫message-viewer ,想在bottle.py 執行的server 上面跑React.js,於是就小找了一下, 基本上排除了使用 bottle-react 這種懶人套件,我想要的就是能直接寫,同時react jsx 也能在我的管控之下的設定。
後來找到這篇文章,照著它的步驟、跟留言的回覆做就成功了,在這邊整理一下:

...