mcpField
V
vite-react-best-practices

vite-react-best-practices

github.com/claudiocebpaz开发16636 次安装40 周前更新
代码仓库

关于 vite-react-best-practices

vite-react-best-practices 是一份面向生产级 Vite 单页应用的 React 指南,涵盖部署、性能、项目结构和故障排查;完整规则见 AGENTS.md。

主要功能

  1. 01单页应用重写与缓存指南
  2. 02构建验证和环境变量规则
  3. 03React 路由拆分与状态管理建议
  4. 04组件性能和图像优化
  5. 05按功能组织项目及故障排查

适用场景

  1. 01搭建 Vite 与 React 项目
  2. 02配置单页应用部署和 CI/CD
  3. 03排查构建或缓存问题
  4. 04重构组件以提升性能

安装

复制下面的命令,在终端中运行。

$npx skills add https://github.com/claudiocebpaz/vite-react-best-practices --skill vite-react-best-practices

安装后在 Claude Code 中输入/vite-react-best-practices确认已加载。

包含的文件

除 SKILL.md 外,安装时一起下载的参考资料和脚本。

README.md
metadata.json
AGENTS.md
marketplace.json
rules/
react-image-optimization.md
react-colocation.md
anti-import-dist.md
react-memoization.md
react-route-splitting.md
react-server-state.md
vite-build-validation.md
vite-caching-strategy.md
vite-env-vars.md
vite-troubleshooting.md
vite-spa-rewrites.md

详细介绍

Vite React 最佳实践

面向资深开发者的指南,介绍如何使用 Vite 构建可用于生产环境的 React 单页应用(SPA)。

适用场景

在以下情况下,请参考这些指南:

  • 搭建新的 Vite + React 项目
  • 配置 SPA 的构建流水线和 CI/CD
  • 排查生产构建或缓存问题
  • 重构 React 组件以提升性能

规则类别

1. Vite SPA 部署(关键)
2. React 核心性能
3. 架构与清理

完整汇编文档

如需查看包含所有展开规则的完整指南:AGENTS.md

评论

支持 Markdown