本文轉載自【微信公眾號:前端人,ID:FrontendPeople】經微信公眾號授權轉載,如需轉載與原文作者聯繫
什麼是前端工程化?
工程化是一種思想,而不是某種技術。其主要目的為了提高效率和降低成本,即提高開發過程中的開發效率,減少不必要的重複工作時間等
慄子
要蓋一棟大樓,假如我們不進行工程化的考量那就是一上來踮起瓦刀、磚塊就開幹,直到把大樓壘起來,這樣做往往意味著中間會出現錯誤,要推倒重來或是蓋好以後結構有問題但又不知道出現在哪誰的責任甚至會在某一天轟然倒塌。
那我們如果用工程化的思想去做,就會先畫圖紙、確定結構、確定用料和預算以及工期,另外需要用到什麼工種多少人等等,我們會先打地基再建框架再填充牆體這樣最後建立起來的高樓才是穩固的合規的,什麼地方出了問題我們也能找到源頭和負責人。
前端工程化需要考慮什麼?
應該從模塊化、組件化、規範化、自動化4個方面去思考
模塊化
模塊化就是把一個大的文件,拆分成多個相互依賴的小文件,按一個個模塊來劃分
組件化
頁面上所有的東西都可以看成組件,頁面是個大型組件,可以拆成若干個中型組件,然後中型組件還可以再拆,拆成若干個小型組件
組件化≠模塊化。模塊化只是在文件層面上,對代碼和資源的拆分;組件化是在設計層面上,對於UI的拆分 目前市場上的組件化的框架,主要的有Vue,React,Angular2
規範化
在項目規劃初期制定的好壞對於後期的開發有一定影響。包括的規範有
目錄結構的制定編碼規範前後端接口規範文檔規範組件管理Git分支管理Commit描述規範定期codeReview視覺圖標規範自動化
也就是簡單重複的工作交給機器來做,自動化也就是有很多自動化工具代替我們來完成,例如持續集成、自動化構建、自動化部署、自動化測試等等