本文通过精美的图文，深入分析 Webpack Loader 的运行机制，带你吃透 Webpack loader 的 11 个核心问题。

前言 大家好，我是林三心，用最通俗易懂的话讲最难的知识点是我的座右铭，基础是进阶的前提是我的初心 当年的校招 依稀记得，当年我参加了大厂的校招，面试的是网易雷火工作室，当时有一道题，我记得很清楚，就是

VUE CLI3的包名称由vue-cli改成@vue/cli。如果你已经安装了旧版本的vue-cli(1.x或2.x)，你先通过npm uninstall vue-cli -g或 yarn global remove vue-cli卸载它。 VUE CLI3和旧版本使用了相同的…

vue 官方为了让开发者快速进行开发，为了很大的精力，提供了vue-cli脚手架，只需简单几步，就能开始vue的开发了。 然而，对项目里的webpack封装和配置了解的不清楚，就容易导致出问题不知如何解决，甚至不会通过webpack去扩展新功能，对webpack+vue项目究竟…

2020年即将到来,在众多前端的招聘要求里,webpack、工程化这些字眼频率越来越高。日常开发者中，我们常常在用诸如vue-cli、create-react-app的脚手架来构建我们的项目。但是如果你想在团队脱颖而出(鹤立鸡群)、拿到更好的offer(还房贷)，那么你必须去深…

webpack是现代前端开发中最火的模块打包工具，只需要通过简单的配置，便可以完成模块的加载和打包。那它是怎么做到通过对一些插件的配置，便可以轻松实现对代码的构建呢？ Plugins：Loaders将各类型的文件处理成webpack能够处理的模块，plugins有着很强的能力。…

5 监视文件改动，热部署。 1. 安装webpack： npx 会自动查找当前依赖包中的可执行文件，如果找不到，就会去 PATH 里找。如果依然找不到，就会帮你安装。 2. webpack 自定义配置 3. 自定义配置文件名 4. webpack-dev-server: 是一个…

Webpack热更新（ Hot Module Replacement，简称 HMR，后续均以 HMR 替代），无需完全刷新整个页面的同时，更新所有类型的模块，是 Webpack 提供的最有用的功能之一。 HMR 作为一个 Webpack 内置的功能，可以通过 --hot 或者 …

自从出现模块化以后，大家可以将原本一坨代码分离到个个模块中，但是由此引发了一个问题。每个 JS 文件都需要从服务器去拿，由此会导致加载速度变慢。Webpack 最主要的目的就是为了解决这个问题，将所有小文件打包成一个或多个大文件，官网的图片很好的诠释了这个事情，除此之外，Web…