|
这个专栏不仅是一个 Webpack 的学习专栏,有大量的 Tips,更是一个比官方文档更实用,更贴合实际应用的 “Webpack 手册”, 是一个你可以 “长期使用 “,“随时可查” 的工具,工作中遇到的实际问题,你甚至能在专栏中找到直接或类似的配置方法、解决方案。
# K+ g( }% u0 G课程目录 :
8 W2 ? d4 ?9 L01 使用 Webpack 实现前端工程化4 I( c- o9 ?, |5 n
02 什么是 Webpack7 y/ h7 A) N$ l; U
03 Webpack 开发环境搭建
q: w/ N( @8 A$ ]- y: B04 使用 webpack-cli 体验零配置打包4 E; [- F' U( J& n
05 基础概念和常见配置项介绍(一)3 o7 s+ `2 i. e5 t$ \0 J0 @
06 基础概念和常见配置项介绍(二)
; j2 ]1 E: s. x# y! b07 Webpack 中的模块化开发
; D R4 }; Q) |08 在 Webpack 中使用 Babel 转换 JavaScript 代码
/ ]3 q1 v5 E2 ] V H" f [) Z; R09 Webpack 中使用 TypeScript 开发项目
6 j1 P0 Z, |7 C3 W( t- M3 V10 Webpack 中样式相关的配置
# c; ?2 r9 n+ W* {) r% n- r11 Webpack 中使用 lint 工具来保证代码风格和质量8 s/ S T3 S+ d7 b; k/ x
12 使用 Webpack 管理项目中的静态资源
+ |9 A( Y( d% Z/ H' h+ a2 T& o; { Z13 Webpack 中打包 HTML 和多页面配置
, I" M. ^ z; Y; X14 Webpack Dev Server 本地开发服务
% V4 z' y, Y2 ~15 Webpack 中配置React和Vue开发环境
$ h1 y# W7 v* x: k16 Webpack 环境相关配置及配置文件拆分
- L2 H2 a% ]* w' _& J; w4 l5 ~17 Webpack 优化之体积优化: D$ Y% h m: K$ r0 `3 d* C9 ?3 N
18 Webpack 优化之增强缓存命中率
6 M# j' ]$ B3 z/ Y) k, R0 M19 使用 Webpack 的 splitChunks 功能来拆分代码2 N# r! s8 I9 r) S+ r% s- v0 \
20 Webpack 优化之速度优化
) M& }+ ?4 e$ q4 i9 C( Q& \) D21 使用 Webpack 的 Tree-Shaking
6 v5 P( E# g3 X* X3 J4 y22 为你准备了一份 Webpack 工程化最佳实践总结
7 |/ f4 f( G* U& G& H9 T5 L9 B$ F23 怎么调试 Webpack?
0 o+ H. x w$ v# @24 Tapable —— Webpack 的核心模块
' U* {, E% i- |9 `6 l- a3 y# g1 u25 Webpack 的 Compiler 和 Compilation. f X* n3 t' u/ ` U6 G
26 Webpack 工作流程) h$ ?- m: y0 M" Y, }
27 从 Webpack 的产出代码来看 Webpack 是怎么执行的. F b. R' R/ |( }* z) m
28 Webpack 的模块热替换做了什么?2 {9 v8 {1 m8 ]4 h
29 实战:使用 PostCSS 打造移动适配方案
* Y: e4 b9 M) _! G30 实战:手写一个 markdown-loader5 ~9 h* q& n1 M4 P
31 实战:手写一个 prefetch-webpack-plugin 插件
3 A7 ^7 W3 h" ?, `; x32 实战:使用中间件来实现 Webpack-dev-server
; G1 h$ x, J/ I5 ^& E33 实战:使用 Stats 数据结构生成 Webpack 构建报告
& X% F; k5 T& ~; @4 b) q |34 实战:给 Webpack 项目添加 modern 模式打包4 ?1 s8 _% ^9 J1 Z& d" H8 _
35 Webpack 5.0
% N, K7 [# M1 k; \) J- L; I# Z36 课程总结
* T: m( }4 R3 Y0 J+ ]/ G7 l3 R37 附录:项目中常用的插件, Z- Y. T9 q1 S. D$ q" e
38 附录:项目中常用的 loader$ c( `4 U2 V8 F) e @8 S7 K
6 j: }6 N2 d! `: ?# W$ {) G0 C8 W
|
|