1. webpack的定义 Webpack是一个用于现代JavaScript应用程序的静态模块打包工具。 2. webpack的背景 Webpack的背景主要源于前端开发复杂度的提升和模块化规范的演变

前言 最近做的需求是海外的项目，使用的 vite2.x 和 vue3 来开发，在第一版提测的时候，发现打包之后，总包大小有 4M 多，有很大的优化的空间。 下面我将从以下几个维度给大家讲下如何优化一个

大家好，我是虚竹，武功练de再好，也要与各路英豪切磋切磋。今天我们先来聊一聊前端项目自动化构建部署的那些事儿。查找收集过很多相关资料教程都讲的不全，比较简陋，所有写了这篇实战水文。

需求开发之殇：日常需求开发时，大家是否也碰到过这样的问题，随着项目仓库越来越臃肿，每次在开发需求时，要花好多时间来定位功能点所在的代码文件以及代码位置，影响整体的开发效率。

经过上手使用，webpack5打包体积大小，持续编译速度都有很不错的提升，对webpack4兼容也很平缓，Module Federation也对项目中如何使用微型前端应用提供一种解决方案。如果升级过程中有遇不兼容的情况，可以去webpack5变更日志上查阅。 在webpack5…

Eslint 可以检查出代码中的错误和一些格式问题，并能自动修复，它的实现原理就是基于 AST （抽象语法树）。 通过 Parser 把源码解析成 AST 对象树，源码字符串中的各种信息就被保存到了这

我们知道 eslint 支持 fix，当添加了 --fix 参数部分 rule 可以自动修复问题。 有没有想过，这种功能是怎么实现的？ babel 也能转换代码，它和 eslint 生成代码的原理一样

转译器的 parser 篇： 如何实现 js 新语法 并编译到 css。 js、css、html parser 都有哪些，如何写 acron 插件、postcss 插件。本文都会告诉你

有小伙伴问我如何修复 vue template 中的 class 名的顺序、属性名顺序，还有 options 中的属性顺序的问题，用 eslint 可以做到么。 答案是能，但是需要写 eslint 插