课程

Webpack5实战教程:前端构建利器深度解析

10 次浏览发布 2026-06-29更新 2026-07-26
本教程深入浅出地讲解了Webpack5的入门与实战技巧,适合前端开发者提升构建效率和项目质量。

课程简介

本课程共9章,从基础配置到高级应用,全面覆盖Webpack5的核心功能。

课程亮点

  • Webpack5基础用法讲解
  • Webpack打包原理剖析
  • Webpack高阶用法实战
  • Webpack构建效率和产物优化技巧
  • React和Vue项目实战应用

适用场景

适合所有前端开发者,无论是新手入门还是资深开发者,都能从本课程中获得宝贵的知识和技能。

📂 资源目录

📁 {1}--第1章课程简介
    {1}--第1章课程简介文档.png  [493.5 KB]
    [1.1]--1-1导学.mp4  [45.1 MB]
📁 {7}--第7章react+webpack实战(react版本的新闻应用)
    {7}--第7章react+webpack实战(react版本的新闻应用)必看.png  [493.5 KB]
    [7.6]--7-6实战开发-登录-3.mp4  [93.9 MB]
    [7.2]--7-2功能拆分和基础界面设置.mp4  [115.7 MB]
    [7.1]--7-1项目基础准备.mp4  [173.6 MB]
    [7.8]--7-8实战开发-新闻列表-2.mp4  [104.1 MB]
    [7.12]--7-12使用pwa优化当前应用.mp4  [130.8 MB]
    [7.3]--7-3服务端功能设计.mp4  [85.6 MB]
    [7.9]--7-9实战开发-详情页.mp4  [92.9 MB]
    [7.5]--7-5实战开发-登录-2.mp4  [110.8 MB]
    [7.11]--7-11浅谈前端性能优化.mp4  [93.6 MB]
    [7.7]--7-7实战开发-新闻列表-1.mp4  [86.0 MB]
    [7.4]--7-4实战开发-登录-1.mp4  [113.1 MB]
    [7.10]--7-10实战开发-详情页.mp4  [92.6 MB]
📁 {3}--第3章学会webpack基础用法,一次搞懂webpack的构建流
    {3}--第3章学会webpack基础用法,一次搞懂webpack的构建流说明.zip  [1.8 MB]
    [3.2]--3-2项目入口-entry.mp4  [81.5 MB]
    [3.6]--3-6构建模式-mode.mp4  [72.3 MB]
    [3.4]--3-4各类资源处理-loader.mp4  [183.4 MB]
    [3.7]--3-7产物源码分析-sourcemap.mp4  [131.7 MB]
    [3.5]--3-5让webpack拥有更强大的功能-plugin.mp4  [122.2 MB]
    [3.3]--3-3构建产物输出-output.mp4  [71.4 MB]
    [3.8]--3-8开发环境模式-devserver.mp4  [130.9 MB]
    [3.1]--3-1webpack配置介绍.mp4  [49.4 MB]
📁 {6}--第6章掌握webpack构建效率和产物优化的必杀技
    {6}--第6章掌握webpack构建效率和产物优化的必杀技必看.png  [493.5 KB]
    [6.5]--6-5构建速度优化-使用外链提升构建速度.mp4  [67.4 MB]
    [6.8]--6-8构建速度优化-借用swc提升webpack构建速度.mp4  [67.6 MB]
    [6.3]--6-3构建速度优化-使用缓存提升二次构建速度.mp4  [139.8 MB]
    [6.4]--6-4构建速度优化-另一种缓存方式-MF.mp4  [38.5 MB]
    [6.11]--6-11构建产物优化-通过优化图片减少静态资源.mp4  [97.4 MB]
    [6.14]--6-14产物优化-使用分包减少主bundle大小-2.mp4  [67.9 MB]
    [6.13]--6-13产物优化-使用分包减少主bundle大小-1.mp4  [165.2 MB]
    [6.9]--6-9产物优化-构建产物体积分析.mp4  [102.9 MB]
    [6.1]--6-1优化准-对webpack构建速度做基本分析.mp4  [114.6 MB]
    [6.2]--6-2构建速度优化-利用计算机多核优化构建.mp4  [99.6 MB]
    [6.15]--6-15构建产物优化-优化polyfill减少不必要的兼容代码.mp4  [67.8 MB]
    [6.10]--6-10构建产物优化-通过代码压缩减小构建产物.mp4  [116.9 MB]
    [6.7]--6-7构建速度优化-使用esbuild提升构建速度.mp4  [121.7 MB]
    [6.12]--6-12构建产物优化-通过清除无用代码减小构建产物.mp4  [135.0 MB]
    [6.6]--6-6构建速度优化-使用更高版本的webpack和node.mp4  [22.6 MB]
📁 {8}--第8章vue+webpack实战(vue版本的新闻应用)
    {8}--第8章vue+webpack实战(vue版本的新闻应用)说明.zip  [1.8 MB]
    [8.2]--8-2项目基础准备-2.mp4  [65.0 MB]
    [8.3]--8-3功能拆分和页面设计.mp4  [130.5 MB]
    [8.1]--8-1项目基础准备-1.mp4  [98.0 MB]
📁 {2}--第2章走进前端构建
    {2}--第2章走进前端构建说明.zip  [1.8 MB]
    [2.3]--2-3webpack的出现带来的变局.mp4  [24.8 MB]
    [2.1]--2-1为什么学习这门课程.mp4  [19.9 MB]
    [2.5]--2-5webpack初体验-构建一个最简单的前端项目.mp4  [87.1 MB]
    [2.4]--2-4前端构建初体验-webpack及相关工具安装.mp4  [53.8 MB]
    [2.2]--2-2了解前端构建的重要性.mp4  [26.2 MB]
📁 {5}--第5章全方位掌握webpack高阶用法
    [5.12]--5-12eslint在webpack中如何配置.mp4  [75.3 MB]
    [5.7]--5-7tree-shaking的原理和应用.mp4  [121.3 MB]
    [5.1]--5-1使用autoprefixer兼容各个浏览器样式属性.mp4  [70.9 MB]
    [5.9]--5-9通过webpack构建去除代码中的调试日志.mp4  [48.1 MB]
    [5.14]--5-14了解modulefederation.mp4  [121.6 MB]
    [5.3]--5-3如何正确的做CodeSpliting.mp4  [91.2 MB]
    [5.13]--5-13了解modulefederation.mp4  [62.1 MB]
    [5.8]--5-8自动清理前一次构建产物.mp4  [37.8 MB]
    [5.5]--5-5将资源内联到html中.mp4  [141.9 MB]
    [5.10]--5-10构建SSR应用-1.mp4  [108.6 MB]
    [5.4]--5-4公共静态资源处理.mp4  [96.7 MB]
    [5.6]--5-6如何实现多页面应用打包.mp4  [146.6 MB]
    [5.11]--5-11构建SSR应用-2.mp4  [65.6 MB]
📁 {9}--第9章工程化能力
    [9.4]--9-4实现一个简单的脚手架.mp4  [135.2 MB]
    [9.3]--9-3编写可扩展的webpack配置.mp4  [76.5 MB]
    [9.1]--9-1如何开发发布一个npm包.mp4  [120.0 MB]
    [9.2]--9-2编写可扩展的webpack配置.mp4  [81.9 MB]
📁 {4}--第4章了解webpack打包原理,对构建的理解更上一层楼
    [4.3]--4-3webpack运行分析之tapable.mp4  [227.4 MB]
    [4.7]--4-7plugin的执行过程.mp4  [94.0 MB]
    [4.5]--4-5loader的执行过程.mp4  [122.2 MB]
    [4.6]--4-6实操-如何实现一个loader.mp4  [99.1 MB]
    [4.8]--4-8如何实现一个plugin.mp4  [147.2 MB]
    [4.1]--4-1webpack打包文件分析.mp4  [193.4 MB]
    [4.4]--4-4webpack运行分析之运行时-compiler.mp4  [133.8 MB]
    [4.2]--4-2webpack运行分析之启动流程.mp4  [145.4 MB]
课件.zip  [107.1 MB]

夸克网盘 · 免费下载

网盘下载链接

点击获取 夸克网盘 链接

https://pan.quark.cn/s/11f56931c753