Quick Start

This page takes you from zero to a running comp-hub instance and your first published component. All you need is a terminal and a browser.

Prerequisites

Item	Requirement
Node.js	16.0.0 or later
npm	8.0.0 or later
Browser	A modern browser such as Chrome, Edge or Firefox

Start the local service

Run the following in your project root (the project that contains the components):

npx comp-hub

npx fetches the CLI on demand, which suits a first try. For long-term use, switch to one of these two options:

# Install globally, then use the comphub command directly
npm install comp-hub@latest -g

# Or add it as a project dev dependency
npm install comp-hub@latest -D
npx comphub

comphub, ch and comp-hub are three names for the same program — use whichever you like.

What you will see

After a successful start, the terminal prints the version, project path, project hash, port and URL:

✓ comp-hub v0.44.11

  Version  0.44.11
  Project  D:\project\my-app
  Hash     94525912
  Port     5478

  URL      http://localhost:5478/94525912/main/

Open the URL in your browser to enter the platform. Common flags:

comphub -p 8080     # Set the port
comphub -d ./src    # Set the component root directory
comphub -l debug    # Adjust the log level

Why did the port not change

-p only takes effect while the master process is not running. If a service is already running, the existing port is reused — run comphub kill first to switch ports.

Publish your first component

A component is a folder, and the folder name is the component name. Prepare the minimal structure first:

MyButton/
├── index.vue      # Entry file (Vue; for React use index.jsx / index.tsx)
└── README.md      # Optional, but strongly recommended

Then complete three steps in the platform:

1. Upload the component: open "Upload Component" from the left menu, select the MyButton folder in the file tree and click "Select".
2. Configure the preview: choose the mini preview and full-screen preview files, review the auto-scanned dependencies and fill in the remarks.
3. Publish: click "Generate Configuration" to create comp.json, then click "Publish" once everything checks out.

After a successful publish the component appears in "My Components" and in the component market. See Upload & Publish for the full rules and Component Spec for how to write a component.

Next steps

• Want to see what the platform already has: Find & Preview
• Want to use someone else's component in your project: Download & Use
• Want to write a component from scratch: Using Studio
• Want to manage the service and publish from the command line: Using the CLI