一、目标二、图片合并工具postcss-sprites三、图片压缩工具image-webpack-loader四、如何体验点击查看Github完整Demo1、安装与启动2、页面展示五、postcss-

首先，没有标题党！这套教程确实是免费的，并且针对每节讲解准备了对应的代码，代码环境是webpack4。 课程以常见的webpack4用法为主线，按照从易到难的顺序，逐步引导搭建，渐进式教程真香。 说句实在话，webpack4其实完全靠文档，但是刚入手的时候还是有个简易教程比较好…

代码执行时机将决定着是否能够正常执行，当依赖文件没加载完成就开始执行、使用对应模块，那么将会导致执行异常。这在“存在资源加载失败时，加载重试影响原来文件的执行顺序”的场景下尤为常见。 webpack 构建除了进行模块依赖管理，实际上，也天然地管理了 entry 与 chunk …

警告：本作品遵循 署名-非商业性使用-禁止演绎3.0 未本地化版本（CC BY-NC-ND 3.0） 协议发布。你应该明白与本文有关的一切行为都应该遵循此协议。 现代化的前端项目中很多都使用了客户端渲染（Client-side Rendering, CSR）的单页面应用（Sin…

本文所讲述的微前端区别于广泛认知的微前端定义，它不兼容不同技术栈（微前端的简单实现），为了区分我称之为同构微前端。相比之下，同构微前端降低复杂度的同时，又避免了多个框架、组件库导致的依赖臃肿问题，是我十分推崇的架构设计。 通过上一节的优化，我们已经有了从零构建中小型单页项目的能…

本篇文章解答了60多道关于webpack的问题，答案有详细有简单，时间关系，有的问题还未做出解答，后续会补上，持续更新。如果答案有不对的地方，请轻拍。 全局安装webpack，意味着webpack包被安装到npm的全局包目录里了。 本地安装webpack，webpack包被安装…

想必经常使用基于webpack打包工具的框架的同学们，无论是使用React还是Vue在性能优化上使用最多的应该是分包策略（按需加载）。按需加载的方式使我们的每一个bundle变的更小，在每一个单页中只需要引入当前页所使用到的JavaScript代码，从而提高了代码的加载速度。但…

随着前端代码需要处理的业务越来越繁重，我们不得不面临的一个问题是前端的代码体积也变得越来越庞大。这造成无论是在调式还是在上线时都需要花长时间等待编译完成，并且用户也不得不花额外的时间和带宽下载更大体积的脚本文件。 然而仔细想想这完全是可以避免的：在开发时难道一行代码的修改也要重…

随着2018年2月15号webpack4.0.0出来已经有一段时间了，webpack依靠着“零配置”，“最高可提升98%的速度”成功吸粉无数，对于饱受项目打包时间过长的我，无疑是看到了曙光，于是决定开始试水。 随着项目的不断迭代，样式文件和js文件的数量越来越多，造成webpa…