Rodel UI

发布流程 ​

两件独立的事：

  1. 文档站：构建静态文件，上传到服务器（Nginx / OSS / CDN）。
  2. npm：@rd-element/ui 与 @rd-element/editor 是两个包，改了哪个发哪个。

根目录 rodel-ui-monorepo 为 private: true，不要发到 npm。

文档站发布到服务器 ​

文档站是 VitePress 静态站点，和 npm 包无关。改文档后：本地构建 → 把产物整目录同步到服务器 → Nginx 指向该目录。

1. 本地构建 ​

仓库根目录：

bash
pnpm install
pnpm build:docs

产物目录：docs/.vitepress/dist/

本地预览产物（可选）：

bash
pnpm --filter docs preview

2. 上传到服务器 ​

将 docs/.vitepress/dist/ 整目录同步到服务器静态目录，例如：

bash
# rsync（按实际主机与路径修改）
rsync -avz --delete docs/.vitepress/dist/ user@your-server:/var/www/rodel-ui-docs/

# 或 scp
scp -r docs/.vitepress/dist/* user@your-server:/var/www/rodel-ui-docs/

也可用公司内部 CI（Jenkins / GitLab CI 等）在 pnpm build:docs 后执行同样的上传步骤。

3. Nginx ​

挂在站点根路径 /：

nginx
server {
  listen 80;
  server_name docs.example.com;
  root /var/www/rodel-ui-docs;
  index index.html;

  location / {
    try_files $uri $uri/ /index.html;
  }

  location ~* \.(js|css|png|jpg|jpeg|gif|svg|ico|woff2?)$ {
    expires 7d;
    add_header Cache-Control "public";
  }
}
bash
sudo nginx -t && sudo systemctl reload nginx

挂在子路径（如 https://example.com/rodel-ui/）时，先改 VitePress base，再重新构建并上传：

ts
// docs/.vitepress/config.ts
export default defineConfig({
  base: '/rodel-ui/',
  // …
})

Nginx 用 location /rodel-ui/ 指向同一 dist 目录。

4. 检查清单 ​

  • [ ] pnpm build:docs 成功
  • [ ] 首页、任意组件页、刷新深链（如 /components/sidebar）正常
  • [ ] Logo / 侧栏 / 图表等静态资源与交互 Demo 可加载
  • [ ] 生产环境建议配置 HTTPS

发布到 npm ​

两个包各自独立发版，改了哪个发哪个：

包目录何时发布
@rd-element/uipackages/rodel-ui组件库有改动
@rd-element/editorpackages/rodel-editor富文本有改动

版本号各自维护。只改 UI 不必 bump editor，反之亦然。

前置条件 ​

  • 已注册 npm 账号
  • 拥有 @rd-element scope 发布权限（或先把对应 package.json 的 name 改成你有权限的 scope）
  • Node.js >= 20、pnpm >= 9

1. 发布前检查 ​

仓库根目录：

bash
pnpm install
pnpm typecheck
pnpm test
pnpm build

发 @rd-element/ui 时，确认 packages/rodel-ui/dist 含：

  • index.js / index.cjs
  • index.d.ts
  • resolver.js / resolver.cjs
  • chart.js / chart.cjs
  • locale.js / locale.cjs
  • style.css

发 @rd-element/editor 时，确认 packages/rodel-editor/dist 含：

  • index.js / index.cjs
  • index.d.ts
  • resolver.js / resolver.cjs
  • style.css

2. 更新版本号 ​

遵循 semver，只改要发布的那个包：

  • UI：packages/rodel-ui/package.json 的 version
  • Editor：packages/rodel-editor/package.json 的 version

npm 上已存在的版本号不能重复发布。

3. 本地 pack 验证（推荐） ​

bash
# 只发 UI
cd packages/rodel-ui
pnpm pack

# 只发 Editor
cd packages/rodel-editor
pnpm pack

会生成 tarball，解压看一眼 dist 是否齐全后再发。

4. 登录并发布 ​

每个包进自己的目录发一次。publishConfig.access: public 已写在各自 package.json 里。

bash
npm login

# 发布组件库
cd packages/rodel-ui
pnpm publish --access public

# 发布富文本（需要时再执行）
cd packages/rodel-editor
pnpm publish --access public

prepublishOnly 会在 publish 前自动 build。仍建议先在根目录跑完 typecheck / test / build。

常见问题 ​

问题处理方式
403 Forbidden检查是否有 @rd-element scope 权限，或改用自有 scope
402 Payment Requiredscoped 包需 --access public，或改用 npm 付费私有包
版本已存在升级对应包 package.json 的 version 后重新发布
只改了一个包只进那个目录 pnpm publish，不要两个一起升版本