第1章 前端工程簡史 1
1.1 前端工程師的基本素養 2
1.1.1 前端工程師的發展曆史 2
1.1.2 前端工程師的技能棧 3
1.2 Node.js帶給前端的改革 7
1.2.1 前端的兩次新生 7
1.2.2 Node.js帶來的改革 9
1.3 前後端分離 12
1.3.1 原始的前後端開發模式 13
1.3.2 前後端分離的基本模式 14
1.3.3 前後端分離與前端工程化 19
1.4 前端工程化 19
1.4.1 前端工程化的衡量準則 20
1.4.2 前端工程化的進化曆程 21
1.4.3 前端工程化的3個階段 32
1.5 工程化方案架構 34
1.5.1 webpack 34
1.5.2 工程化方案的整體架構 36
1.5.3 功能規劃 37
1.5.4 設計原則 41
1.6 總結 42
第2章 腳手架 43
2.1 腳手架的功能和本質 44
2.2 腳手架在前端工程中的角色和特徵 45
2.2.1 用完即棄的發起者角色 45
2.2.2 局限於本地的執行環境 47
2.2.3 多樣性的實現模式 49
2.3 開源腳手架案例剖析 51
2.4 集成Yeoman封裝腳手架方案 56
2.4.1 封裝腳手架方案 57
2.4.2 集成到工程化體係中 63
2.5 總結 66
第3章 構建 68
3.1 構建功能解決的問題 68
3.2 配置API設計原則和編程範式約束 71
3.2.1 配置API設計 71
3.2.2 編程範式約束 75
3.3 ECMAScript與Babel 76
3.3.1 ECMAScript發展史 76
3.3.2 ES6的跨時代意義 78
3.3.3 Babel——真正意義的JavaScript編譯 80
3.3.4 結閤webpack與Babel實現JavaScript構建 84
3.4 CSS預編譯與PostCSS 89
3.4.1 CSS的缺陷 90
3.4.2 CSS預編譯器 90
3.4.3 PostCSS 91
3.4.4 webpack結閤預編譯與PostCSS實現CSS構建 93
3.4.5 案例:自動生成CSS Sprites功能實現 95
3.5 模塊化開發 101
3.5.1 模塊化與組件化 101
3.5.2 模塊化與工程化 102
3.5.3 模塊化開發的價值 103
3.5.4 前端模塊化發展史 107
3.5.5 webpack模塊化構建 109
3.6 增量更新與緩存 112
3.6.1 HTTP緩存策略 113
3.6.2 覆蓋更新與增量更新 117
3.6.3 按需加載與多模塊架構場景下的增量更新 120
3.6.4 webpack實現增量更新構建方案 122
3.7 資源定位 128
3.7.1 資源定位的曆史變遷 128
3.7.2 常規的資源定位思維 132
3.7.3 webpack的逆嚮注入模式 132
3.8 總結 147
第4章 本地開發服務器 149
4.1 本地開發服務器解決的問題 150
4.2 動態構建 152
4.2.1 webpack-dev-middleware 152
4.2.2 Livereload和HMR 157
4.3 Mock服務 161
4.3.1 Mock的必要前提和發展進程 162
4.3.2 異步數據接口 166
4.3.3 SSR 172
4.4 總結 174
第5章 部署 175
5.1 部署流程的設計原則 175
5.1.1 速度——化繁為簡 177
5.1.2 協作——代碼審查和部署隊列 181
5.1.3 安全——嚴格審查和權限控製 184
5.2 流程之外:前端靜態資源的部署策略 186
5.2.1 協商緩存與強製緩存 186
5.2.2 Apache設置緩存策略 186
5.3 總結 190
第6章 工作流 191
6.1 本地工作流 192
6.1.1 二次構建的隱患 193
6.1.2 代碼分離與測試沙箱 194
6.2 雲平颱工作流 197
6.2.1 GitFlow與版本管理 199
6.2.2 WebHook與自動構建 201
6.3 持續集成與持續交付 203
6.4 總結 205
第7章 前端工程化的未來 206
7.1 前端工程師未來的定位 206
7.1.1 不隻是瀏覽器 207
7.1.2 也不隻是Web 208
7.2 前端工程化是一張藍圖 209
7.3 總結 212
· · · · · · (
收起)