🏗️前端工程化
前端工程化工具发展历程、工具深度对比、TypeScript 运行时、构建提速、脚手架、部署与容器化
总览与导论
脚手架与项目搭建
开发效率工具
- 02-界面调试：热更新技术如何开着飞机修引擎？
- 03-构建提速：如何正确使用 SourceMap？
- 04-接口调试：Mock 工具如何快速进行接口调试？
- 05-编码效率：如何提高编写代码的效率？
- 06-团队工具：如何利用云开发提升团队开发效率？
- 07-vscode快捷键与插件
- 08-vscode设置
npm-scripts
代码分析工具
低代码与无代码
构建工具演进
Webpack核心
Webpack性能优化
Webpack源码与生态
工程管理
部署与容器化
编程规范与最佳实践
模块库与组件库
其他主题
webpack
- 01-Webpack概述与核心概念
- 02-Webpack配置结构
- 03-Babel+TS+ESLint工程环境
- 04-CSS工程环境
- 05-Vue全栈开发环境
- 06-React全栈开发环境
- 07-构建NPM-Library
- 08-微前端应用
- 09-PWA+Node+Electron应用
- 10-图像加载原理与实践
- 11-核心配置结构深入
- 12-构建性能分析工具
- 13-持久化缓存
- 14-并行构建与优化
- 15-SplitChunks代码分割
- 16-代码压缩
- 17-应用性能极致优化
- 18-Loader开发基础
- 19-Loader开发进阶
- 20-插件开发基础
- 21-插件开发进阶
- 22-核心流程Init-Make-Seal
- 23-依赖图管理
- 24-Chunk打包逻辑
- 25-Runtime运行时逻辑
- 26-Tree-shaking原理
- 27-Sourcemap原理
- 28-HMR热更新原理
- 29-源码调试环境搭建
- 30-CLI-TypeScript调试
- 31-CLI执行流程
- 32-build命令执行流程
- 33-npm链接调试技巧
- 34-tapable核心库
- 35-tapable实践
- 36-tapable源码实现
- 37-源码执行流程详解
vite
- 01-Vite概述
- 02-核心配置详解
- 03-插件系统
- 04-构建优化与部署
- 05-双引擎架构
- 06-Esbuild功能使用与插件开发实战
- 07-Rollup
- 08-开发Vite插件
- 09-HMR的API及原理
- 10-体积拆包
- 11-语法降级与Polyfill
- 12-Vite搭建服务端渲染工程
- 13-模块联邦
- 14-ESM高阶特性和PurmESM
- 15-Vite项目性能优化
- 16-配置服务解析
- 17-依赖预构建
- 18-插件流水线
- 19-手写Vite实现no-bundle开发服务
- 22-Vite项目大屏适配
vite入门教程
组件库工程化
- 01-MVP原型系统-将组件封装为组件库
- 02-CSS样式-用UnoCSS实现原子化CSS
- 03-文档建设-创建具备Demo示例功能的文档网站
- 04-单元测试(一)-使用Jest进行前端单元测试
- 05-单元测试 (二)-搭建Vitest的单元测试环境
- 06-规范化-Eslint + Prettier + Husky
- 07-软件包封装-如何发布兼容多种 JS 模块标准的软件包
- 08-持续集成 CI-基于 github Action 的回归验证
- 09-开发许可证-维护自己的版权、拒绝拿来党
- 10-组件发布-建立语义化版本与提交软件包仓库 Npm
- 11-建立组件库生态-利用 Monorepo 方式管理组件库生态
- 12-按需引入实现组件库的按需引入功能
- 13-文档部署-用 Vercel 部署你的线上文档
- 14-README-编写标准的 README
- 15-品质保证-覆盖率测试报告
- 16-社区参与-如何管理社区的 PullRequest
- 17-敏捷开发-用 Github 看板和 issue 管理需求
- 18-架构复用-创建 CLI 工具提高研发体验
- 19-融入开源生态-编写 npm init 项目让用户更方便
- 20-类型系统：导出组件库的类型定义