Your team recently adopted a centralized design system (DS) to streamline UI consistency and accelerate development. However, your codebase still contains numerous custom components that duplicate functionality provided by the DS. To fully adopt the design system and simplify the codebase, you need to identify and replace all custom components with their DS equivalents.
https://www.youtube.com/watch?v=fy_Fezyl7E8&feature=youtu.be
To start, ensure you have the Componly CLI installed:
npm install -g @componlyco/cli
For MacOS and some Linux distributions, you may need to use sudo for proper installation:
sudo npm install -g @componlyco/cli
Scan Your Codebase
Run the following command to analyze your repository and generate a comprehensive list of components:
npx componly run
This command creates a JSON file (components-usage.json) that includes data on all components, including their imports and usage.
Generate a Detailed Report
To categorize components as custom or DS-based, generate a report with:
npx componly report