現在要來研究React.js,
不過根據React官網的介紹,
為了使用React.js最簡單的方式當然就是下載不用自己建置的JavaScript就可以了,
可惜天不從人願,
這樣的寫法可能無法完整了解react的api....
所以請自己建置吧~
官網建議使用 browserify 或是 webpack.
這邊就介紹webpack了~~~~
為什麼要特別介紹呢!
因為我要被官網搞死~~
沒有任何基礎下指令怎麼下都是不對的.....................
廢話不多說
Step 1 : install npm
NPM - Node Package Manager 為什麼要用他呢?
請參考連結,因為JavaScript日益茁壯,NPM的功能跟NUGet差不多。
最簡單的安裝方式就是安裝Node.js,
Step 2 : install react
記得用工作管理員開啟cmd
$ npm install --save react react-dom babel-preset-react
Step 3 : install webpack
參考webpack官網
$ npm install webpack -g
接下來都是抄官網的..............
Step 4 : setup the compilation
先移動到預計寫code的資料夾~~~cd 應該會吧~
然後新增兩個檔案
1.entry.js
document.write("It works.");
2.index.html
<html> <head> <meta charset="utf-8"> </head> <body> <script type="text/javascript" src="bundle.js" charset="utf-8"></script> </body> </html>
接下來就簡單了~~
執行指令把entry.js建置成bundle.js(畢竟html裡面是include bundle.js
$ webpack ./entry.js bundle.js
這樣就可以啦~~~~其實官網寫得很清楚了~~
剩下的我就不多說~
最重要的是最後一步,
因為webpack預設是讀取webpack.config.js,
所以最終是要把所有設定都寫在config.js裡面。
沒有留言:
張貼留言