快速开始

这一页带你从零启动 comp-hub，并发布第一个组件。整个过程只需要终端和浏览器。

前置条件

项目	要求
Node.js	16.0.0 及以上
npm	8.0.0 及以上
浏览器	Chrome、Edge、Firefox 等现代浏览器

启动本地服务

在项目根目录执行（组件所在的项目）：

npx comp-hub

npx 会按需拉取 CLI，适合第一次体验。长期使用建议改成下面两种方式之一：

# 全局安装，之后直接用 comphub 命令
npm install comp-hub@latest -g

# 或作为项目开发依赖
npm install comp-hub@latest -D
npx comphub

comphub、ch、comp-hub 是同一个程序的三个名字，用哪个都可以。

你会看到什么

启动成功后，终端会打印版本、项目路径、项目 hash、端口和访问地址：

✓ comp-hub v0.44.11

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

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

在浏览器打开 URL 就进入平台。常用参数：

comphub -p 8080     # 指定端口
comphub -d ./src    # 指定组件根目录
comphub -l debug    # 调整日志级别

端口为什么没变

-p 只在 master 进程尚未运行时生效。已有服务在跑时会复用原端口，需要换端口先执行 comphub kill。

发布第一个组件

组件就是一个文件夹，文件夹名即组件名。先按下面的最小结构准备：

MyButton/
├── index.vue      # 入口文件（Vue；React 用 index.jsx / index.tsx）
└── README.md      # 可选，但强烈建议

然后在平台里完成三步：

1. 上传组件：左侧菜单进入「上传组件」，在文件树里选中 MyButton 文件夹，点击「选择」。
2. 配置预览：选择小窗预览与全屏预览文件，核对自动扫描出的依赖，填写备注。
3. 发布：点击「生成配置」创建 comp.json，确认无误后点击「发布」。

发布成功后，组件会出现在「我的组件」与组件市场中。完整规则见上传与发布，组件写法见组件规范。

下一步

• 想先看看平台上有什么：找到与预览
• 想把别人的组件用到项目里：下载与使用
• 想从零写一个组件：使用 Studio
• 想用命令行管理服务与发布：使用 CLI