在使用Webpack Dev Server以后 可以让我们在开发工程中 专注于 Coding， 因为它可以监听代码的变化 从而实现打包更新，并且最后通过自动刷新的方式同步到浏览器，便于

前言 Vue项目开发一直使用的脚手架，对Webpack这个黑匣子知之甚少，碰到问题总是一头雾水，所以趁着Webpack5.0发布不久，较完整地学习了一遍。本篇文章总结一下学习成果。整体大纲如下： 认识

后者很容易理解，因为chunk在webpack中的含义就是模块，那么chunkhash根据定义来就是模块内容计算出来的hash值。 这里我们还得提一个问题，比如像vue这些框架，把js和css共同放在一个里面会时，我们一般会用一个插件叫extract-text-webpack-…

做了一夜动画，让大家十分钟搞懂Webpack 一、什么是webpack webpack是一个打包工具，他的宗旨是一切静态资源皆可打包。 二、原理分析 首先我们通过一个制作一个打包文件的原型。 假设有两

在前端工程化日趋复杂的今天，模块打包工具在我们的开发中起到了越来越重要的作用，其中webpack就是最热门的打包工具之一。 说到webpack，可能很多小伙伴会觉得既熟悉又陌生，熟悉是因为几乎在每一个项目中我们都会用上它，又因为webpack复杂的配置和五花八门的功能感到陌生。…

Webpack5 在 2020 年 10 月 10 日正式发布，并且在过去的几个月中快速演进和迭代，截止 1 月 28 日，Webpack5 已经更新了 18 个 minor 版本，带来了许多十分吸引人的新特性。据官网介绍，Webpack5 整体的方向性变化有以下几点： 最后的…

1. webpack-dev-server 无法启动项目 2. 启动项目之后报错 3. devtool 4. 开启 hot: true 但是热更新无效 还需要注意一个问题：如果使用了 mini-css-extract-plugin 插件（将样式以 link 的形式引入而不是 s…

本文从这 2 个角度出发，收集一些相关优化资料。 resolve.modules 用于配置 Webpack 去哪些目录下寻找第三方模块，默认是 ['node_modules']。 但是，它会先去当前目录的 ./node_modules 查找，没有的话再去 ../node_mod…

声明：本篇文章基于webpack v4.43.0，如按照文中代码执行报错，请检查依赖模块版本是否和示例代码仓库中一致。 *温馨提示：*本篇内容更偏实战，涉及大量代码，如有代码密集恐惧症的老爷，请速速离场。 在上一篇的内容中，介绍了webpack的核心概念以及常用的核心配置，并尝…