Webpack:卓效 Web 前端開發建置工具強能技術 (舊名: JS 高手昇華之路:Webpack 是唯一的捷徑)
內容描述
模組化打包 × 多方位支援管理 × 效能優化 × 不侷限於Web開發
循序入門、設定、實戰、最佳化和原理層層深進,涵蓋Webpack各方面及特性解析。
提供對應的完整專案程式資源,適用Webpack的任何穩定版本。
Webpack 從許多建置工具中脫穎而出,成為前端開發必備工具,是每位前端工程師必備技能。
本書從實作出發, 用簡單容易的實例帶領讀者快速入門Webpack,再結合實際工作中常用的場景列出實作案例,解決工作中的常見問題。
本書還介紹了如何最佳化建置的速度和輸出,並解析Webpack 的工作原理,以及Plugin 和Loader 的撰寫方法,可幫助讀者進一步學習Webpack。
無論是對Webpack一無所知的初學者,還是經驗豐富的前端工程師,相信都能透過本書對Webpack的理解,並在Web開發中更熟練地運用Webpack。
適用:Webpack初學者、希望深入掌握Webpack的前端工程師。
目錄大綱
前言
Chapter01 入門
1.1 前端的發展
1.2 常見的建置工具及比較
1.3 安裝Webpack
1.4 使用Loader
1.5 使用Plugin
1.6 使用DevServer
1.7 核心概念
Chapter02 設定
2.1 Entry
2.2 Output
2.3 Module
2.4 Resolve
2.5 Plugin
2.6 DevServer
2.7 其他設定項目
2.8 整體設定結構
2.9 多種設定類型
2.10 歸納
Chapter03 實戰
3.1 使用ES6語言
3.2 使用TypeScript語言
3.3 使用Flow檢查器
3.4 使用SCSS語言
3.5 使用PostCSS
3.6 使用React架構
3.7 使用Vue架構
3.8 使用Angular2架構
3.9 為單頁應用產生HTML
3.10 管理多個單頁應用
3.11 建置同構應用
3.12 建置Electron應用
3.13 建置Npm模組
3.14 建置離線應用
3.15 搭配Npm Script
3.16 檢查程式
3.17 透過Node.js API啟動Webpack
3.18 使用Webpack Dev Middleware
3.19 載入圖片
3.20 載入SVG
3.21 載入Source Map
3.22 實戰歸納
Chapter04 最佳化
4.1 縮小檔案的搜索範圍
4.2 使用DllPlugin
4.3 使用HappyPack
4.4 使用ParallelUglifyPlugin
4.5 使用自動更新
4.6 開啟模組熱取代
4.7 區分環境
4.8 壓縮程式
4.9 CDN加速
4.10 使用Tree Shaking
4.11 分析公共程式
4.12 分割程式以隨選載入
4.13 使用Prepack
4.14 開啟Scope Hoisting
4.15 輸出分析
4.16 最佳化歸納
Chapter05 原理
5.1 工作原理概括
5.2 輸出檔案分析
5.3 撰寫Loader
5.4 撰寫Plugin
5.5 偵錯Webpack
5.6 原理歸納
AppendixA 常用的Loader
AppendixB 常用的Plugin
AppendixC Webpack的其他學習資源
作者介紹
吳浩麟
一線前端工程師,曾就職於騰訊,現就職於美團。專注於Web開發,參與過眾多大型Web專案的構建、設計和開發,喜歡探索Web前沿技術。也是Golang和音視頻技術的愛好者,活躍於GitHub,ID為gwuhaolin。