|
|
这个专栏不仅是一个 Webpack 的学习专栏,有大量的 Tips,更是一个比官方文档更实用,更贴合实际应用的 “Webpack 手册”, 是一个你可以 “长期使用 “,“随时可查” 的工具,工作中遇到的实际问题,你甚至能在专栏中找到直接或类似的配置方法、解决方案。
) r' ?$ \, f! d% p课程目录 :
" R5 _/ b, }- U8 X; E6 Z( e01 使用 Webpack 实现前端工程化( l5 C, E9 A4 t
02 什么是 Webpack
+ s: m3 ^6 s' U C03 Webpack 开发环境搭建
8 s1 l8 s' C$ C5 ~2 _; a04 使用 webpack-cli 体验零配置打包
v, |/ R/ B8 J$ R: ^( N9 N05 基础概念和常见配置项介绍(一); `: o4 _: l* k% I6 t/ u8 U
06 基础概念和常见配置项介绍(二)( v6 U/ [5 v3 `" x0 V" B" R
07 Webpack 中的模块化开发& M O0 Z9 ~. B/ F: z
08 在 Webpack 中使用 Babel 转换 JavaScript 代码
2 X7 \) K# A. b) Y6 l09 Webpack 中使用 TypeScript 开发项目4 x! r E% \/ {8 ^; l
10 Webpack 中样式相关的配置
~; K7 ^$ h9 E `% {/ t11 Webpack 中使用 lint 工具来保证代码风格和质量9 Z) S" @3 F0 ^1 D. Y
12 使用 Webpack 管理项目中的静态资源8 |. _; N2 F7 C) D# R
13 Webpack 中打包 HTML 和多页面配置
/ u0 ]2 m4 `$ I. b7 i14 Webpack Dev Server 本地开发服务
! N% s5 S* G3 z2 K3 p1 C: P15 Webpack 中配置React和Vue开发环境
7 h" b- D1 T4 U7 G7 R6 L16 Webpack 环境相关配置及配置文件拆分2 g9 h9 P3 V, D' b; C
17 Webpack 优化之体积优化
0 A3 C# V: `8 ~! O! a18 Webpack 优化之增强缓存命中率
% s$ @8 {4 R$ R5 T6 h) e19 使用 Webpack 的 splitChunks 功能来拆分代码
! `! _# y- B; f8 \) Q# Y20 Webpack 优化之速度优化
: L& M7 I9 o/ g21 使用 Webpack 的 Tree-Shaking
; s5 |6 k- z% R+ X3 J$ ~22 为你准备了一份 Webpack 工程化最佳实践总结
$ m3 D1 t- I9 g; O% g23 怎么调试 Webpack?1 U& o. r) a* `5 f; U
24 Tapable —— Webpack 的核心模块
: X a1 ~* N2 }% \3 _. Z3 S- [25 Webpack 的 Compiler 和 Compilation2 [, b: L" ~0 E0 M) V
26 Webpack 工作流程4 l1 S' Q* K2 y
27 从 Webpack 的产出代码来看 Webpack 是怎么执行的
, B0 N& N% a4 |/ h9 J28 Webpack 的模块热替换做了什么?- S( c' E" H, U5 M- P
29 实战:使用 PostCSS 打造移动适配方案
+ ]% U& ?. |+ X% V30 实战:手写一个 markdown-loader0 i# x0 z5 s% Y m9 p
31 实战:手写一个 prefetch-webpack-plugin 插件& N3 C, C9 A% L( ^
32 实战:使用中间件来实现 Webpack-dev-server
Y/ Y O" W' t. [: I; o% K33 实战:使用 Stats 数据结构生成 Webpack 构建报告; z! @$ V8 S2 o4 M
34 实战:给 Webpack 项目添加 modern 模式打包
* D) y9 ?# R8 ^6 o35 Webpack 5.06 g( h3 v' i$ Z& \/ c
36 课程总结
, h, d2 t+ `# d Q6 s& g0 p37 附录:项目中常用的插件
& J1 |2 b/ t0 L1 C38 附录:项目中常用的 loader
4 ?$ W. c" w& e" q% s) c
8 M$ |7 f+ [' U7 q I4 @' E6 X
|
|