前端工具链资源¶
本文档汇总前端工程化与工具链相关的优质外部资源，包括官方文档、学习教程、工具指南等。
官方文档¶
构建工具¶
- Webpack 官方文档 - Webpack 官方文档（英文）
- Webpack 中文文档 - Webpack 官方中文文档
- Vite 官方文档 - Vite 官方文档
- Vite 中文文档 - Vite 官方中文文档
- Rollup 官方文档 - Rollup 官方文档
- esbuild 官方文档 - esbuild 官方文档
- Turbopack 官方文档 - Turbopack 官方文档
包管理器¶
代码质量工具¶
- ESLint 官方文档 - ESLint 官方文档
- Prettier 官方文档 - Prettier 官方文档
- TypeScript ESLint - TypeScript ESLint 官方文档
- Stylelint 官方文档 - Stylelint CSS 代码检查工具
转译与编译¶
- Babel 官方文档 - Babel 官方文档
- TypeScript 官方文档 - TypeScript 官方文档
- SWC 官方文档 - SWC 高性能 JavaScript/TypeScript 编译器
CSS 工程化¶
- PostCSS 官方文档 - PostCSS 官方文档
- Sass 官方文档 - Sass 官方文档
- Less 官方文档 - Less 官方文档
- Tailwind CSS 官方文档 - Tailwind CSS 官方文档
- UnoCSS 官方文档 - UnoCSS 原子化 CSS 引擎
Monorepo 工具¶
- Lerna 官方文档 - Lerna Monorepo 管理工具
- Turborepo 官方文档 - Turborepo 高性能构建系统
- Nx 官方文档 - Nx 智能 Monorepo 工具
- Rush 官方文档 - Rush 可扩展 Monorepo 管理器
学习资源¶
综合教程¶
- Webpack Guidebook - 📚 Webpack 知识图谱：模块化、基础概念、工作原理、实战应用
- 深入浅出 Webpack - 吴浩麟著，系统介绍 Webpack
- Webpack 从入门到精通 - azl397985856 的 Webpack 教程
博客文章¶
Webpack¶
- Webpack 原理系列 - Webpack 工作原理深度剖析
- Webpack 性能优化实践 - 掘金优质文章
- 手写 Webpack 插件和 Loader - 插件开发实战
Vite¶
- 为什么 Vite 这么快 - Vite 原理解析
- Vite 插件开发指南 - 官方插件开发文档
Monorepo¶
- Monorepo 的这些坑，你们都遇到了吗？ - Monorepo 实践经验
- 现代前端工程化-深入浅出 pnpm workspace - pnpm workspace 实践
Babel¶
- 深入浅出 Babel - Babel 原理与实践
- Babel 插件开发指南 - Babel 插件开发手册
工具与插件¶
Webpack 生态¶
- Webpack Bundle Analyzer - 打包体积分析工具
- speed-measure-webpack-plugin - 打包速度分析工具
- webpack-dashboard - Webpack 仪表盘
性能分析¶
- Lighthouse - Google 网站性能分析工具
- WebPageTest - 网站性能测试工具
- Bundle Phobia - npm 包体积分析
在线工具¶
- AST Explorer - 在线 AST 查看与调试工具
- Babel REPL - 在线 Babel 转译工具
- CanIUse - 浏览器兼容性查询
书籍推荐¶
- 《深入浅出 Webpack》 - 吴浩麟著
- 《前端工程化：体系设计与实践》 - 周俊鹏著
- 《现代前端工程实践》 - 蒋豪群著
视频课程¶
- Webpack 5 核心原理与应用实践 - 极客时间
- 玩转 Webpack - 极客时间
- 前端工程化精讲 - 腾讯课堂
社区与论坛¶
- Webpack GitHub Discussions - Webpack 官方讨论区
- Vite GitHub Discussions - Vite 官方讨论区
- 掘金 - 前端工程化专栏 - 掘金优质文章
开源项目参考¶
Webpack 配置模板¶
- webpack-boilerplate - Webpack 5 配置模板
- react-webpack-boilerplate - React + Webpack 脚手架
Vite 配置模板¶
- vite-plugin-pages - 文件系统路由插件
- vite-plugin-mock - Mock 数据插件
Monorepo 项目示例¶
- Babel Monorepo - Babel 项目使用 Lerna
- Vue 3 Monorepo - Vue 3 源码使用 pnpm workspace
- React Monorepo - React 源码 Monorepo 结构
相关内部文档¶
维护说明： 本文档定期更新，如发现链接失效或有推荐资源，请及时反馈。
最后更新： 2024-10