webpack

这一篇主要写的是如何手写webpackloader，通过这一篇文章可以掌握简单的loader的写法。

这一篇主要写了loader的四种写法和一些不同的地方，以及一些常用的loader API，为下面写loader做铺垫！

前面我已经学习了webpack的基础知识和一些应用，下面会写一下webpack的原理知识，来加深对webpack的了解！

这篇主要写了如果使用webpack从0开始搭建一个Vue脚手架，以及一些配置的优化等，能够更好地提升打包构建速度，优化代码性能！

前面已经学习了一些webpack的基本配置，然后下面用学过的一些配置来从零搭建一个React脚手架！

前面几篇从四个角度对 webpack 和代码进行了优化,下面就将这些总结起来写成一篇文章，面试必备宝典,每一点都附上了如何使用的文档！

我们开发的 Web App 项目，当项目一旦处于网络离线情况，就没法访问了,为了能够给项目提供良好的离线体验，就需要用到PWA。

前面我们使用 babel 对 js 代码进行了兼容性处理，其中使用 @babel/preset-env 智能预设来处理兼容性问题，这一篇写corejs解决es6+的兼容问题

这一篇主要写了如何通过optimization.runtimeChunk让文件能够更好的进行缓存,来提高用户的体验！

前面我们已经做了代码分割，同时会使用 import 动态导入语法来进行代码按需加载(按需加载也叫懒加载,比如路由懒加载就是通过 import 实现的)但是加载速度还可以进行优化.

假设现在有一个按钮，当点击时需要执行一段操作,那么也就是说在我没有点击时不需要执行这段操作，所以在我点击之前页面其实并不需要加载这段操作的代码。

在我们打包代码时会将所有 js 文件打包到一个文件中，体积太大了。假如我们只要渲染首页，就应该只加载首页的 js 文件，其他文件不应该加载，所以我们可以将打包生成的文件进行代码分割。

这一篇主要写了`Tree Shaking`和babel的runtime注入以及图片压缩,通过这篇文章的操作，能够有效地对打包后代码体积的优化！

提升 js 的打包速度，因为其他文件都比较少。而对 js 文件处理主要就是 eslint 、babel、Terser 三个工具，所以下面我们就要提升它们的运行速度。

这一篇主要写了webpack中Include/Exclude和Cache的使用，能够让代码的运行速度更快！

这一篇主要写了webpack提升打包构建速度的`HotModuleReplacement`和oneOf提升打包构建速度。

SourceMap，无论是在开发环境还是在生产环境，只要代码出现错误，在控制台都可以准确的将错误信息给到我们，大大的提升我们开发以及解决错误问题的效率！

这一篇文章写了如何将css文件提取成为单独文件，并进行了css样式兼容、css压缩，以及重复代码的封装。

这一篇主要写了对html资源的处理，开发模式配置，以及生产模式准备工作，让webpack打包的速度更快！

这一篇主要写了JS资源的处理,因为 Webpack 对 js 处理是有限的，只能编译 js 中 ES 模块化语法，不能编译其他语法，导致 js 不能在 IE 等浏览器运行，所以就需要做一些兼容性处理。