前端工程化：體系設(shè)計(jì)與實(shí)踐

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