Component Studio CLI

A powerful CLI tool for building, developing, and publishing components with Component Studio.

Installation

# Global installation
npm install -g @blocklet/component-studio-cli

# Or use npx directly
npx @blocklet/component-studio-cli init my-component

Commands

Initialize a new project

component-studio init [project-name]

Creates a new component project with a minimal directory structure.

Start development server

component-studio dev

Starts a development server with a hidden configuration, making development simpler.

Add components or tools

component-studio add [name] [-t, --template <template>]

Adds a component or tool from template to your project.

Migrate components

component-studio migrate <url> [--output-dir <dir>]

Migrates components from an existing pages-kit project.

Update dependencies

component-studio update

Updates both workspace and project dependencies.

Features

• Simple Development: Hide complex configuration from developers
• Flexible Templates: Choose from different component templates
• Component Addition: Easy to add new components from templates
• Component Migration: Import components from existing pages-kit projects
• Easy Updates: Keep dependencies up-to-date with a single command

Project Structure

When using Component Studio CLI, your project structure will look like this:

my-component/
  ├── src/
  │   ├── components/        # Component files
  │   │   ├── MyComponent.tsx      # Example component
  │   │   └── @metadata.json       # Component metadata
  │   └── index.ts           # Main entry point
  ├── package.json
  ├── tsconfig.json
  ├── vite.config.ts         # Minimal config, enhanced by CLI
  └── README.md

License

ISC