用途:在 JavaScript/TypeScript 项目中配置、编写或调试 Panda CSS,并处理从其他方案迁移到 @pandacss/dev 的工作。
主要能力:可协助搭建或迁移 @pandacss/dev;编辑 panda.config.* 文件;集成 PostCSS 或 Panda CLI;使用生成的 styled-system;处理 token、utility、recipe、pattern 等配置项;排查生成文件、CSS 层导入、content globs、TypeScript include 路径与运行时导入路径等问题。
使用方式:修改前先检查现有设置,包括包管理器与仓库说明(尤其 AGENTS.md)、package.json 的 scripts 与依赖、panda.config.、postcss.config.、框架配置、根 CSS 导入、tsconfig.json 以及生成的 styled-system 用法。优先沿用项目已有的集成方式;新项目在框架支持时优先用 PostCSS,PostCSS 不可用或项目已使用 CLI 生成 CSS 时用 Panda CLI。遵循项目的包管理器与脚本;JS/TS 一次性命令默认用 pnpx,除非仓库说明或锁定文件明确偏好其他命令。编写样式时保持可被提取:优先把对象字面量传给生成的 helpers,如 css、recipes、patterns、styled;避免动态构造样式键或类名,除非配置中已通过 staticCss 静态覆盖。配置、token、utility、recipe 或 pattern 变更后要重新生成 Panda 产物,并确认仓库使用的是 prepare、postinstall、dev、build 还是显式的 panda codegen 脚本。验证时沿实际失败路径检查生成文件、CSS 层导入、content globs、TypeScript include 路径和运行时导入路径。需要精确的安装代码片段、配置键、编写模式、token 语法、CLI 命令或排错检查时,可查阅 references/panda-css.md。
适用场景:Panda CSS 项目的初始搭建与迁移、日常样式编写、构建产物与类型问题排查。
限制:具体版本、依赖安装命令、价格或平台信息暂未提供;实际配置键与命令以仓库资料和官方文档为准。