Smart Create Tool

Intelligently scaffold new files, components, and modules using project conventions and templates.

When to Use This Command

Run this command when you need to:

• Create a new component, service, or module that follows the project's existing patterns
• Generate boilerplate files with proper imports, types, and test stubs matching team conventions
• Scaffold multiple related files (component, styles, tests, stories) in a single invocation

Consider alternatives when:

• You need to create a single simple file with no particular convention to follow
• Your framework's built-in CLI generator (ng generate, rails generate) better suits the task

Quick Start

Configuration

Copy
name: smart-create-tool
type: command
category: documentation

Example Invocation

Copy
claude command:run smart-create-tool --type component --name UserProfile

Example Output

Project Analysis:
  Framework: React + TypeScript
  Styling: CSS Modules
  Testing: Jest + React Testing Library
  Conventions: PascalCase components, camelCase hooks

Scanning existing patterns...
  Reference component: src/components/Dashboard/Dashboard.tsx
  Pattern: functional component + props interface + default export

Generated files:
  [+] src/components/UserProfile/UserProfile.tsx
  [+] src/components/UserProfile/UserProfile.module.css
  [+] src/components/UserProfile/UserProfile.test.tsx
  [+] src/components/UserProfile/index.ts (barrel export)

All files follow project conventions. Ready for implementation.

Core Concepts

Convention Detection Overview

Aspect	Details
File Naming	Detects PascalCase, camelCase, kebab-case, or snake_case patterns
Component Structure	Identifies class vs functional components, HOCs, hooks patterns
Import Style	Named exports vs default exports, barrel files, path aliases
Test Conventions	Test file location (co-located vs tests), naming, assertions
Styling Method	CSS Modules, Tailwind, styled-components, or plain CSS detection

Scaffold Workflow

  Create Request
       |
       v
  +-------------------+
  | Scan Project      |---> Analyze existing file patterns
  +-------------------+
       |
       v
  +-------------------+
  | Extract Patterns  |---> Naming, imports, structure
  +-------------------+
       |
       v
  +-------------------+
  | Select Template   |---> Match type to detected pattern
  +-------------------+
       |
       v
  +-------------------+
  | Generate Files    |---> Component, styles, tests, index
  +-------------------+
       |
       v
  +-------------------+
  | Validate Output   |---> Lint check, import resolution
  +-------------------+

Configuration

Parameter	Type	Default	Description
type	string	component	What to create: component, hook, service, page, util, model
name	string	required	Name of the file or module to create
directory	string	auto-detect	Target directory, inferred from project conventions if omitted
with_tests	boolean	true	Generate accompanying test files
with_styles	boolean	auto-detect	Generate style files based on project styling method

Best Practices

1. Let Convention Detection Drive Output - Do not override detected patterns unless you have a deliberate reason to deviate. Consistency across the codebase is more valuable than personal preference on any single file.

2. Generate Tests as a Default - Always include test stubs even if the developer plans to write tests later. Having the file present with a basic structure lowers the barrier to writing tests and prevents them from being forgotten.

3. Use Barrel Exports When the Project Does - If the codebase uses index.ts barrel files for re-exports, generate them. If it does not, skip them. Adding a new pattern that does not exist elsewhere creates confusion.

4. Keep Generated Code Minimal - Generate the skeleton structure with type definitions and key imports, but do not fill in implementation logic. The developer knows the business logic; the tool's job is to eliminate boilerplate.

5. Verify After Generation - Run the project's linter on generated files to ensure they pass. A scaffolded file that immediately triggers lint errors creates friction instead of saving time.

Common Issues

1. Wrong Naming Convention Applied - The tool detected kebab-case from configuration files but the source code uses PascalCase. Limit convention scanning to the same file type being generated (scan .tsx files when generating a .tsx component).

2. Duplicate Barrel Export Entry - The generated index.ts conflicts with an existing one. Check whether the parent directory already has an index file and append to it rather than overwriting or creating a duplicate.

3. Import Path Aliases Not Resolved - Generated files use relative paths while the project uses path aliases like @/components. Detect tsconfig paths or webpack aliases and use them in generated import statements.