@anker-in/headless-ui NPM

开发

使用方法

npm install @anker-in/headless-ui

无头项目修改tailwind.config.ts 配置文件

import type { Config } from 'tailwindcss'
+ import headlessUIPreset from '@anker-in/headless-ui/tailwind.config.js'


export default {
  + presets: [
  +  headlessUIPreset, // ❗❗❗重要！使用预设
  + ],
  content: [
   + './node_modules/@anker-in/headless-ui/dist/**/*.js', // ❗❗❗重要！把这些加入content
  ],
} satisfies Config

因为headless-ui 使用纯 ESM 模块, 所以有些非标准第三方ESM模块比如gsap可能会在nextjs 中加载失败，需要修改无头项目的next.config.js ，显式声明需要 transpile 的包

// next.config.js
module.exports = {
  transpilePackages: ['@anker-in/headless-ui', 'gsap'],
}

添加 design token css 变量文件
在入口文件 app.js 直接引入 design token css

import '@anker-in/headless-ui/tokens/base.css'
import '@anker-in/headless-ui/tokens/{barnd}.css' // brand 可以是 anker, eufy 等等

查看所有Token https://headless-ui-doc.netlify.app?path=/docs/design-token--docs Tokens 支持覆盖

// 使用组件
import { Button, Skeleton } from '@anker-in/headless-ui'
import { HeroBanner } from '@anker-in/headless-ui/biz'

// ...

<Button size="lg" variant="primary">
    Primary
</Button>
<Button size="sm" variant="secondary">
    secondary
</Button>

<Skeleton className="w-[300px] h-[300px] rounded-full" />

<HeroBanner data={nammerConfig}>

❗❗❗异常处理

如果出现 import { XXX } from '@anker-in/headless-ui/biz'
typescript 报错的情况，可以把

"@anker-in/headless-ui/biz": [
        "./node_modules/@anker-in/headless-ui/dist/esm/biz-components/index"
      ],

添加到tsconfig 配置文件的"paths" 属性。这可能是旧版本的moduleResolution 不支持

0.0.27-alpha.43

6 months ago

0.0.27-alpha.42

6 months ago

0.0.27-alpha.41

6 months ago

0.0.27-alpha.1748157870

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

0.0.27-alpha.1747836270545

6 months ago

5 months ago

5 months ago

5 months ago

5 months ago

5 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

0.0.27-alpha.1747823662003

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

0.0.27-alpha.1747821758645

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

5 months ago

5 months ago

5 months ago

7 months ago

7 months ago

7 months ago

7 months ago

7 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

5 months ago

6 months ago

5 months ago

6 months ago

5 months ago

6 months ago

7 months ago

7 months ago

7 months ago

7 months ago

7 months ago

7 months ago

7 months ago

7 months ago

7 months ago

7 months ago

7 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

0.0.27-alpha.1749173788588

5 months ago

0.0.30-alpha.1

5 months ago

0.0.30-alpha.3

5 months ago

0.0.30-alpha.2

5 months ago

0.0.27-alpha.1748162136

6 months ago

0.0.30-alpha.5

5 months ago

0.0.30-alpha.4

5 months ago

0.0.27-alpha.1747840693

6 months ago

7 months ago

7 months ago

7 months ago

7 months ago

7 months ago

7 months ago

7 months ago

7 months ago

7 months ago

7 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

0.0.27-alpha.1749123906503

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

6 months ago

5 months ago

6 months ago

5 months ago

5 months ago

5 months ago

5 months ago

0.0.27-alpha.1747756802000

6 months ago

5 months ago

5 months ago

5 months ago

5 months ago

5 months ago

5 months ago

5 months ago

5 months ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago