purgecss能删第三方库css而tree-shaking不能，因前者扫描源码中实际使用的类名并反向剔除未用选择器，后者仅分析js模块import/export依赖，无法解析css文件内部规则。
为什么 PurgeCSS 能删掉第三方组件库的 CSS，但 tree-shaking 不能
因为 tree-shaking 只分析 import/export 的 JS 模块依赖关系，而第三方组件库的全量 CSS（如 element-plus/dist/index.css）通常是通过 import 语句一次性引入的——构建工具看到“这个文件被引用了”，就把它整个打进包里，根本不会去读里面写了多少个 .el-button 或 .ant-modal。PurgeCSS 不同，它不看 JS 依赖，而是扫描你的源码中实际出现的类名（class="el-button"、class="ant-tabs"），再反向比对 CSS 文件里哪些选择器没被用到，直接剔除。
配置 PurgeCSS 时必须指定 content，且路径要覆盖所有模板和组件
常见错误是只写 ['./src/**/*.vue']，漏掉 .ts 中动态拼接的类名、.html 静态页面、甚至 public/index.html 里的内联 class。PurgeCSS 无法推断运行时生成的类，所以你得显式告诉它“这些地方可能出现有效类名”：
content: ['./src/**/*.{vue,ts,js,jsx,tsx}', './public/index.html']- 若用了
vite-plugin-purgecss，注意 Vite 4.3+ 默认不启用content自动探测，必须手动配 - 动态类名如
class="btn btn--{{ type }}"或:class="['el-input', size && 'el-input--' + size]"，需在whitelistPatterns中加/^el-input--/这类正则 - 图标类（
el-icon-edit、anticon-home）常被 JS 动态插入，也得进白名单，否则图标全丢
第三方库的样式文件路径必须真实存在，且不能靠 @import 间接加载
PurgeCSS 只处理它能读到的 CSS 内容。如果你在 main.css 里写 @import 'element-plus/dist/index.css'，它只会扫描 main.css 本身，根本不会去解析那个 @import 后面的文件。正确做法是：
如果你了解HTML，CSS和JavaScript，您已经拥有所需的工具开发Android应用程序。本动手本书展示了如何使用这些开源web标准设计和建造，可适应任何Android设备的应用程序 - 无需使用Java。您将学习如何创建一个在您选择的平台的Android友好的网络应用程序，然后转换与自由PhoneGap框架到一个原生的Android应用程序。了解为什么设备无关的移动应用是未来的潮流，并开始构建应用程序，提供更
- 把组件库的样式文件显式列进
css入口或extract配置中，例如 Webpack 的MiniCssExtractPlugin需确保element-plus/theme-chalk/button.css被作为独立模块参与构建 - Vite 用户推荐直接
import 'element-plus/theme-chalk/button.css'，这样它会被识别为一个 chunk，PurgeCSS 才能拿到原始内容 - 避免
require('xxx.css')或document.createElement('link')这种运行时加载，PurgeCSS 完全不可见 - 检查打包产物目录里是否真有对应 CSS 文件输出；没有的话，PurgeCSS 再配也没用
压缩后体积没变小？先查 rollup-plugin-visualizer 或 source-map-explorer
很多人以为 PurgeCSS 没生效，其实是压错了对象。第三方组件库的 CSS 占比可能不到 30%，真正撑大体积的是：normalize.css、全局动画 @keyframes、暗黑模式切换逻辑、字体图标文件（@font-face）、甚至 iconfont.css 里那几 MB 的 woff2。这些往往写在入口 CSS 里，又没绑定任何 JS 组件调用，PurgeCSS 压根不会碰它们。
用 rollup-plugin-visualizer 打开产物分析页，点开 assets/ 下最大的 CSS 文件，看里面高频出现的是 .el- 还是 @font-face 或 .animate-。如果是后者，就得单独处理：禁用图标字体、改用 SVG 内联、把动画抽成按需加载的 JS 控制模块。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
