Webpack 是一个前端资源加载/打包工具，只需要相对简单的配置就可以提供前端工程化需要的各种功能。
文章推荐
《Webpack 拆包：关于 splitChunks 的几个重点属性解析》
从分析图中可以比较直观的看出，三个输出 bundle 文件中都包含了 m1.js 文件，这说明有重复的模块代码。splitChunks 的目的就是用来把重复的模块代码分离到单独的文件，以异步加载的方式来节省输出文件的体积。splitChunks 的配置项很多而且感觉官方文档的一些描述不是很清楚，下面通过一些重点配置属性和场景解释来帮助大家理解和弄懂如何配置 splitChunks。为方便理解和简单演示，Webpack 和 splitChunks 的初始设置如下
看到这个 标题，是的，我本是个后端，最近要写点 node.js， 之前写前端，知道 npm build 一下，那么用 javascript 写的后端程序也要 npm build 吧，好的，作为个 gopher ， 带着对 javascript 的刻板印象就开干了。
我本 gopher，奈何没有一个会前端的老婆，就自己干前端了，如果干的不对，请及时纠正
本系列文章是我在学习 Webpack 时的总结与收获，希望我的一些学习内容可以帮助到一些正在学习 Webpack 的朋友。本片文章为系列文章的第二篇，包含 Webpack 基础配置与 css 相关 loader
《用 Webpack 从0到1打包一个按需加载的vue组件库》
在vue项目开发中，我们会将经常用到的逻辑或模块抽象成组件，对于那些多个项目都有用到的组件，可以考虑封装成组件库，发布到npm。每次要到只需要npm install xx一下，就不用来回拷贝了。下面我们就从0开始来打包一个vue组件库。
在使用 Webpack 进行项目打包的时候，我们可通过以下方式对不同类型的资源，进行文件名或文件路径的修改
环境分离主要是区分本地和生产两种环境，本地调试需要能实时看到代码变化，而生产环境需要编译成指定的文件。
可以采用两种方式
开发环境和生产环境分别定义配置文件，在 package.json 中定义对应的指令
开发环境和生产环境共用配置文件，通过参数来区分环境
浏览器不支持 CommonJS ，在特定场景下才支持 Es Module ，而 Webpack 可以将这些模块化的代码解析成浏览器可识别的语法。那么 Webpack 究竟是对模块化做了怎样的处理呢？一起来看看。
持久化缓存是 Webpack 5 所带来的非常强大的特性之一。一句话概括就是构建结果持久化缓存到本地的磁盘，二次构建(非 watch 模块)直接利用磁盘缓存的结果从而跳过构建过程当中的 resolve、build 等耗时的流程，从而大大提升编译构建的效率。
《「基础搭建」从零开始，基于 Webpack 5 搭建一个 Vue-Cli 》
大家平时在进行Vue开发的时候，大部分人都是使用 Vue-cli 这个现成的Vue脚手架来进行开发的，但是用它用了这么久，你难道不想自己搭一个属于自己的 Vue-cli 吗？
今天我就带大家来搭建一个基本的 Vue-cli ，也可以让大家对 Webpack 有更深入的了解！建议大家一定要跟着我一步一步来哦！
事先说明：本文只介绍vue-cli基本配置，关于优化、规范这两方面，我后面会再写两篇文章进行讲解
在使用 Webpack 中的项目的时候，我们可以使用 esModule，也可以使用 commonJS，还可以使用 import(moduleName) 进行模块的懒加载，那么这一切 Webpack 是怎么做到的呢？
问答推荐
- 如何将前端页面部署到服务器让外部客户访问到
- 通过 WebpackDevServer 配置 https 启动项目后，想取消 https 要怎么配置
- 求大佬帮助，vue 项目在 public 下放入过多图片资源导致运行或打包时报错： too many open files
- 如何使用 Webpack 处理特殊文件，比如xx.lock文件
- Webpack 热更新 编译出错。
- 如何通过 Webpack 或 rollupjs 加密代码使 nodejs 模块私有？
- vue的项目源码丢了，目前得到了 Webpack 打包后文件，怎么解析到源码？
- Webpack 如何打包成一个js
- Webpack 项目跑起来之后，取不到.env中的配置，progress is not defined
- Webpack 打包favicon.ico打不进去，线上引用不到？
PS：大家想看哪些方面的技术内容，可以在评论区留言喔 ~
如有问题可以添加小姐姐微信~
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用。你还可以使用@来通知其他用户。