@arco-materials/site-anchor

Arco 文档站锚点

Usage no npm install needed!

<script type="module">
  import arcoMaterialsSiteAnchor from 'https://cdn.skypack.dev/@arco-materials/site-anchor';
</script>

README

Arco 物料模板

注意

此项目只有在 Arco 官方 Monorepo 模板中才能正常使用。

快速开始

// 开发模式
yarn run dev

// 构建
yarn run build

// 生成元数据 arcoMeta
arco generate

// 发布包
arco publish

// 查看当前 arco-scripts 使用的配置
yarn run show:config -- webpack:component

API 文档

为了帮助他人更好地使用你的组件,请提供详细的 API 文档。

书写注释

我们使用了 react-docgen-typescripts 来提取组件 Props 的注释,然后自动生成组件的 API 文档。为此,如果你想对外暴露一个 Property,请像下边这样为其书写注释:

// ✅ 可以被正确提取的注释
// 😁 新增的特性推荐标明支持的版本
interface ButtonProps {
  /** 按钮的尺寸 */ 
  size?: 'mini' | 'small' | 'default' | 'large';
  /** 按钮的状态 (`1.2.0` 开始支持) */
  status?: 'danger' | 'error' | 'success';
}

// ❌ 会被忽略的注释
interface ButtonProps {
  // 按钮的尺寸
  size?: 'mini' | 'small' | 'default' | 'large';
}

扩展 TEMPLATE.md

TEMPLATE.md 是用于自动文档生成的模板,你可以修改此文件添加更多组件的使用帮助信息,但请不要删除其原有的内容,否则可能导致内容替换失败。

// TEMPLATE.md
---
file: index
---

# ACAnchor

## 属性/Props

%%Props%%

### OtherProps

在这里你可以书写更多组件帮助文档。

## Demos

%%Demos%%

测试

测试目录位于 src/__test__。你可以在 index.test.tsx 中编写你的测试用例,在 demo.test.tsx 中可以进行基于 Demo 的快照测试,所以在增加了新的 Demo 之后,请修改 demo.test.tsx

yarn run test 命令允许你传入任何 jest 的命令行参数,例如 yarn run test -- --u yarn run test -- --no-cache

DEMO

Demo 目录位于 src/demo。你可以在此目录中加入多个 Demo,它们将在 NPM 发布时一同被发布。 如果你添加了一个 Demo,那么你需要在 stories/stories.jsx 添加对应代码,才能在 Storybook 中预览到它。

查看完整帮助文档