作者：dmyang的部落格

網址：http://segmentfault.com/a/1190000003499526

本篇主要介紹webpack的基本原理以及基於webpack搭建純靜態頁面型前端專案工程化解決方案的思路。

下篇（還沒寫完）探討下對於Node.js作為後端的專案工程化、模組化、前後端共享程式碼、自動化部署的做法。

關於webpack的更多用法和前端工程的討論，可以到github https://github.com/chemdemo/chemdemo.github.io/issues/10

關於前端工程

下麵是百科關於“軟體工程”的名詞解釋：

軟體工程是一門研究用工程化方法構建和維護有效的、實用的和高質量的軟體的學科。

其中，工程化是方法，是將軟體研發的各個鏈路串接起來的工具。

對於軟體“工程化”，個人以為至少應當有如下特點：

• 有IDE的支援，負責初始化工程、工程結構組織、debug、編譯、打包等工作
• 有固定或者約定的工程結構，規定軟體所依賴的不同類別的資源的存放路徑甚至程式碼的寫法等
• 軟體依賴的資源可能來自軟體開發者，也有可能是第三方，工程化需要整合對資源的獲取、打包、釋出、版本管理等能力
• 和其他系統的整合，如CI系統、運維繫統、監控系統等

廣泛意義上講，前端也屬於軟體工程的範疇。

但前端沒有Eclipse、Visual Studio等為特定語言量身打造的IDE。因為前端不需要編譯，即改即生效，在開發和除錯時足夠方便，只需要開啟個瀏覽器即可完成，所以前端一般不會扯到“工程”這個概念。

在很長一段時間裡，前端很簡單，比如下麵簡單的幾行程式碼就能夠成一個可執行前端應用：

 	 	 	 	 	 	



app title