QQ登录

只需要一步,快速开始

APP扫码登录

只需要一步,快速开始

查看: 2669|回复: 0

Webpack从零入门到工程化实战

[复制链接]

等级头衔

积分成就    金币 : 2861
   泡泡 : 1516
   精华 : 6
   在线时间 : 1326 小时
   最后登录 : 2026-4-16

丰功伟绩

优秀达人突出贡献荣誉管理论坛元老活跃会员

联系方式
发表于 2019-12-16 15:06:05 | 显示全部楼层 |阅读模式
       这个专栏不仅是一个 Webpack 的学习专栏,有大量的 Tips,更是一个比官方文档更实用,更贴合实际应用的 “Webpack 手册”, 是一个你可以 “长期使用 “,“随时可查” 的工具,工作中遇到的实际问题,你甚至能在专栏中找到直接或类似的配置方法、解决方案。) P- \1 _) x) i8 R9 L& Y
课程目录 :% y) A: _' i! s. L
01  使用 Webpack 实现前端工程化
( `) R5 }, J, U7 G5 s, X02 什么是 Webpack
+ B( x. Y' p9 ^& L  ~03 Webpack 开发环境搭建
: t0 g) @4 l9 U! [7 z8 i, \0 S04 使用 webpack-cli 体验零配置打包
* I2 \! V0 W/ ?& `05 基础概念和常见配置项介绍(一)% ?! Z& @  `' Y, k6 e. Q" y
06 基础概念和常见配置项介绍(二)( i& a9 q/ A1 }" V
07 Webpack 中的模块化开发
- R' F8 T7 g$ h9 U" _# y2 L' R# l2 a08 在 Webpack 中使用 Babel 转换 JavaScript 代码
2 E; {8 ~3 W1 j- ?4 g. ?09 Webpack 中使用 TypeScript 开发项目( L+ `2 `" b$ b9 s1 o% m
10 Webpack 中样式相关的配置( ?" L: j8 w& w! t% P8 l' O& w: J) w
11 Webpack 中使用 lint 工具来保证代码风格和质量
+ p0 Q- E  k, o0 o1 ?12 使用 Webpack 管理项目中的静态资源
& y! K  @, G) b4 [/ \13 Webpack 中打包 HTML 和多页面配置
) |1 t2 u# @/ u3 j/ J3 i* A$ e14 Webpack Dev Server 本地开发服务% M& M$ _% j; B8 @
15 Webpack 中配置React和Vue开发环境
3 \" c& W9 r9 A# I) }) D* P# C16 Webpack 环境相关配置及配置文件拆分
, }* K: W! Q& h: O& Y17 Webpack 优化之体积优化* n0 L1 x3 Z: g  K
18 Webpack 优化之增强缓存命中率  A% A/ k0 d' H+ c
19 使用 Webpack 的 splitChunks 功能来拆分代码
' B" c2 [0 i' _% y1 _4 m+ Z20 Webpack 优化之速度优化: S# c% w- p# L: F
21 使用 Webpack 的 Tree-Shaking
4 c" S$ Y' K2 x, R% r; Y22 为你准备了一份 Webpack 工程化最佳实践总结! D# I" I8 F: ^/ a' \! O8 j0 \- ^/ G
23 怎么调试 Webpack?) O$ s, `# a0 D* O0 k% _9 V' q2 T
24 Tapable —— Webpack 的核心模块
( ~0 @6 x8 [1 I$ g: C7 o25 Webpack 的 Compiler 和 Compilation, J% D0 E: n* E' \( G) Z& ?6 D
26 Webpack 工作流程
! x$ o  O+ ^1 f. S* ~% {, q27 从 Webpack 的产出代码来看 Webpack 是怎么执行的
% Y. R' Z! b& e28 Webpack 的模块热替换做了什么?$ o0 d2 E* e. p% y
29 实战:使用 PostCSS 打造移动适配方案6 v3 D2 p" ]1 w' ?7 W2 N( S0 v* c
30 实战:手写一个 markdown-loader
) k1 @1 R) J2 W' i31 实战:手写一个 prefetch-webpack-plugin 插件
% J: G# {" \+ Z! A$ m32 实战:使用中间件来实现 Webpack-dev-server
8 F: ^0 N1 Z) g" D/ i- T33 实战:使用 Stats 数据结构生成 Webpack 构建报告
  B) s% S- |5 [6 F7 S. _5 q- A( U0 W34 实战:给 Webpack 项目添加 modern 模式打包
- {' L  W' p& j% d2 _35 Webpack 5.0
, L( ?* U. `) u) p36 课程总结: ]# S4 R( P, ^; ]) \1 v
37 附录:项目中常用的插件- h; C; \$ ?: Z9 c  k" L4 u
38 附录:项目中常用的 loader
2 T& x9 e- N8 C7 `# k * m3 E( R! A6 e% K' y
1.jpg
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

QQ|手机版|小黑屋|paopaomj.COM ( 渝ICP备18007172号|渝公网安备50010502503914号 )

GMT+8, 2026-4-18 16:40

Powered by paopaomj X3.5 © 2016-2025 sitemap

快速回复 返回顶部 返回列表