前言本文会带你简单的认识一下webpack的loader，动手实现一个利用md转成抽象语法树，再转成html字符串的loader。顺便简单的了解一下几个style-loader，vue-loader，babel-loader的源码以及工作流程。
除了 minChunks 等分包基础配置项之外，cacheGroups 还支持一些与分组逻辑强相关的属性，包括:test:接受正则表达式、函数及字符串，所有符合 test 判断的 Module 或 Chunk 都会被分到该组 type:接受正则表达式、函数及字符串，与 test 类似均用于筛选分组命中的模块，区别是它判断的依据是文件类型而不是文件名，例如 type = 'json' 会命中所有 JSON 文件 name:chunk命名 priority:数字型，用于设置该分组的优先级，若模块命中多个缓存组，则优先被分到 priority 更大的组 缓存组的作用在于能为不同类型的资源设置更具适用性的分包规则，一个典型场景是将所有 node_modules 下的模块统一打包到 vendors 产物，从而实现第三方库与业务代码的分离。
针对新手入门搭建项目，Webpack5 配置手册（从0开始）webpack 5webpack安装顺序1. `npm init -y`，初始化包管理文件 package.json2. 新建src源代码目录3. 新建index.html4.
第三步、打包命令配置。通过 ./node_modules/webpack/bin/webpack.js --config webpack.config.js 这条命令来进行打包，除了使用 --config 配置参数外，还可以通过 --help 查看其它命令参数:为了避免每次都要写 ./node_modules/webpack/bin/webpack.js --config webpack.config.js 这么一长串的命令，可以使用 npm scripts 来简化操作，修改 package.json 中的 scripts 属性，添加 build，执行命令npm run bulid 即可进行打包:“scripts”: {。“build”: “npx webpack --config webpack.config.js”
module 是指 package.json 里面的 name，如使用是 Vant 对应的 module 为@vant/weapp，如果使用是 iview，刚对应的 module 为 iview-weapp，具体可看它们各自的 package.json。
大家一定看过很多电子设备开箱测评，今天我们也来跑一个软件新版的上手测评 —— Webpack 5!从 2017 年发出关于 v5 的投票开始，到 2019 年 10 月发布第一个 beta 版本，目前是 5.0.0-beta.16。
前言最近由于用着html-webpack-plugin觉得很不爽，于是乎想自己动手写一个插件。原以为像gulp插件一样半天上手一天写完，但令人郁闷的是完全找不到相关的文章。一进官方文档却是被吓傻了。首先是进入how to write a plugin看了一页简单的介绍。
