Loomix
文档中心开发者技术手册Loomix CLI 专属开发脚手架工具

Loom CLI 与组件注册中心 (Loomix Registry)

内置的强大命令行工具，开发者仅需一行指令，即可直接从 GitHub Registry 下载并同步全新的模块化区块与视觉样式，无需额外编写集成代码。

开发者小贴士
在终端中运行 loom --help，可查阅所有支持的命令与参数选项。

1. 什么是 Loom CLI 与 Loomix Registry？

Loom CLI 犹如专属于您电商商城的组件包管理器，让您轻松探索数百款现成的精美区块样式并在数秒内无缝整合。

  • 一键从官方 GitHub 注册中心拉取并同步全新区块组件与样式。
  • 自动探测并补齐依赖包，同时自动维护组件导出的 barrel 索引文件。
  • 支持团队与技术外包团队接入私有注册中心（Private Registry）。
  • 全自动打通 GitHub Actions CI/CD 流水线，实现自动化发版。
  • 将指定的区块视觉样式直接下载并安装到项目的 components 目录中。
查询注册中心当前可用区块列表
bash
npx loom list-blocks

1.2 区块样式与 Strapi 管理后台自动同步

将最新下载的区块设计样式全自动同步至 Strapi CMS 的下拉枚举选项中。

  • 自动检测 blocks 目录下新增的组件变体样式。
  • 自动更新 Strapi 对应组件架构文件（Schema）中的 style 枚举字段。
  • 运营人员可在 Strapi 后台立即选中并应用全新设计风格。

2. 安装与使用 Loom CLI

该工具已预置于代码库中，支持直接通过 npx 或 pnpm 调用执行：

在 Loomix Registry 目录中定位心仪的区块组件。

运行安装指令：npx loom add-block 。

CLI 将自动下载 TypeScript 源码并注入匹配的 Tailwind CSS 样式。

自动在 BlockRenderer.tsx 注册中心完成新区块挂载。

打开 Strapi 后台，即刻挑选并启用全新的视觉版式。

3. 安装指定区块或特定样式的命令

为 Hero 首屏区块新增第 4 种设计风格（Style 4）的安装范例：

指定样式直接安装命令
bash
npx loom add-block hero --style 4

4. 前端区块源码目录结构规范

全部区块组件均规范组织在 src/components/blocks 目录下，结构清晰且高内聚。

官方与自定义私有注册中心

官方注册中心 (Official Registry)：

由 Loomix 核心团队依据 Next.js 最新技术规范持续迭代与优化的官方精品样式库。

私有注册中心 (Private Registry)：

支持企业或外包机构自建私有 GitHub 仓库，以便在多个客户项目间无缝沉淀与复用组件资产。

模块化区块目录树拓扑：

分层组件体系与 barrel 文件 (index.ts) 组织结构：

私有组件注册表标准化工程目录规范
text
src/components/blocks/
├── hero/
│   ├── HeroStyle1.tsx
│   ├── HeroStyle2.tsx
│   └── index.ts
├── features/
│   ├── FeaturesStyle1.tsx
│   └── index.ts
└── BlockRenderer.tsx

配置私有 GitHub 注册中心的步骤：

  1. 在 GitHub 上创建名为 loomix-custom-registry 的新仓库。
  2. 将自定义区块代码及其 schema.json 文件按规范归档放入仓库。
  3. 在 .env 中填入具备 repo 访问权限的 GitHub Personal Access Token (PAT)。
  4. 通过 npx loom registry set-url 指向您的专属仓库地址。
在环境变量中配置注册中心
env
LOOMIX_REGISTRY_URL=https://raw.githubusercontent.com/your-org/loomix-registry/main
LOOMIX_REGISTRY_TOKEN=ghp_your_token_here