cc-alignment

Rename Compound Component exports and refactor directory structures to vendor standards.

1.7k|421|Updated Apr 23, 2024
One-click install
npx skills add https://github.com/mercurjs/mercur --skill cc-alignment-mercurjs
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: cc-alignment
Source: https://github.com/mercurjs/mercur/tree/main/.claude/skills/cc-alignment
Command: npx skills add https://github.com/mercurjs/mercur --skill cc-alignment-mercurjs

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill helps developers align existing Compound Component pages with vendor standards, ensuring uniform structure and naming conventions that facilitate maintainability and integration.

Core Features & Use Cases

  • Renames and prefixes component exports to match specified naming conventions such as XxxDetailPage and MainGeneralSection.
  • Refactors project structure by updating barrel files, route index files, and testing registry entries.
  • Verifies build integrity through TypeScript DTS compatibility checks, ensuring no regressions after alignment.
  • Use Case: A team upgrades their CC pages to the latest standard, reducing inconsistencies and easing future modifications.

Quick Start

Use this Skill to align your CC pages by renaming components and updating exports as per the vendor guidelines.

Frequently Asked Questions about cc-alignment

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I standardize React component exports for project consistency?

To standardize React component exports for project consistency, you can rename and prefix component exports to match specified naming conventions such as XxxDetailPage and MainGeneralSection. This ensures uniform structure across your projects and eases future modifications.

What is the best way to refactor directory structures for Compound Component pages?

Refactoring directory structures for Compound Component pages involves updating barrel files, route index files, and testing registry entries. This alignment ensures vendor standard consistency and supports proper TypeScript type declaration generation across the project.

Does refactoring component exports affect TypeScript build integrity?

Refactoring component exports can affect TypeScript build integrity, but you can verify it through TypeScript DTS compatibility checks. This process ensures no regressions occur after aligning your components to vendor standards.

Can I update barrel files and route index files to align with vendor standards?

Yes, you can update barrel files and route index files to align with vendor standards. This refactoring standardizes Compound Component pages, ensuring structural consistency and facilitating maintainability across different projects.

Why do I need to prefix React component exports like XxxDetailPage?

Prefixing React component exports like XxxDetailPage is needed to align existing Compound Component pages with vendor standards. This naming convention ensures uniform structure, facilitating easier integration and future modifications across the project.