这13个webpack插件，让你的项目起飞_page skeleton github

这就是 PurgeCSS 发挥作用的地方。PurgeCSS 分析您的内容和 CSS 文件。然后它将文件中使用的选择器与内容文件中的选择器相匹配。它从您的 CSS 中删除未使用的选择器，从而生成更小的 CSS 文件。

2 Offline Plugin ⭐ 4,427

地址

该插件旨在为webpack项目提供离线体验。它使用ServiceWorker和AppCache作为引擎盖下的后备。只需将此插件包含在您webpack.config的 .cpp 文件中，并在您的客户端脚本中包含随附的运行时，您的项目将通过缓存所有（或部分）webpack 输出资产来准备离线。

3. Mini Css Extract Plugin ⭐ 4,331

地址

这个插件将 CSS 提取到单独的文件中。它为每个包含 CSS 的 JS 文件创建一个 CSS 文件。它支持按需加载 CSS 和 SourceMaps

4 Extract Text Webpack Plugin ⭐ 4,076

地址

从一个或多个包中提取文本到一个单独的文件中。

5 Critters ⭐ 2,754

地址
一个 Webpack 插件，用于内联关键 CSS 并延迟加载其余 CSS。

6 Copy Webpack Plugin ⭐ 2,654

地址

将已存在的单个文件或整个目录复制到构建目录。

7 Hard Source Webpack Plugin ⭐ 2,589

地址

HardSourceWebpackPlugin是 webpack 的插件，为模块提供中间缓存步骤。

8 React Refresh Webpack Plugin ⭐ 2,287

地址

用于为 React 组件启用“快速刷新”（也称为热重载）

9 Preload Webpack Plugin ⭐ 2,174

地址

用于使用<link rel='preload'>. 这有助于延迟加载。

10 Page Skeleton Webpack Plugin ⭐ 2,153

地址

Page Skeleton 是一款 webpack 插件，该插件的目的是根据你项目中不同的路由页面生成相应的骨架屏页面，并将骨架屏页面通过 webpack 打包到对应的静态路由页面中。

现在能在网上找到很多很多的学习资源，有免费的也有收费的，当我拿到1套比较全的学习资源之前，我并没着急去看第1节，我而是去审视这套资源是否值得学习，有时候也会去问一些学长的意见，如果可以之后，我会对这套学习资源做1个学习计划，我的学习计划主要包括规划图和学习进度表。

分享给大家这份我薅到的免费视频资料，质量还不错，大家可以跟着学习

网上学习资料一大堆，但如果学到的知识不成体系，遇到问题时只是浅尝辄止，不再深入研究，那么很难做到真正的技术提升。

需要这份系统化学习资料的朋友，可以戳这里无偿获取

一个人可以走的很快，但一群人才能走的更远！不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人，都欢迎加入我们的的圈子（技术交流、学习资源、职场吐槽、大厂内推、面试辅导），让我们一起学习成长！