@easyx.ai/dumi-theme-easyxai
Version:
@easyx.ai/dumi-theme-easyxai 是为 dumi2 打造的一款文档站主题包,提供了更加美观、易用的研发与阅读体验
67 lines (38 loc) • 2.98 kB
Markdown
<a name="readme-top"></a>
<div align="center">
<h1>@easyx.ai/dumi-theme-easyxai</h1>
一款为 dumi2 打造的文档站主题包,提供了更加美观、易用的研发与阅读体验
[Report Bug][issues-url] · [Request Feature][issues-url]
<!-- SHIELD GROUP -->
[![ docs by dumi][dumi-url]](https://d.umijs.org/) [![Build With father][father-url]](https://github.com/umijs/father/)
<!-- gitpod url -->
[gitpod-badge]: https://img.shields.io/badge/Gitpod-ready--to--code-blue?logo=gitpod
[gitpod-url]: https://gitpod.io/#https://github.com/ant-design/@easyx.ai/dumi-theme-easyxai
<!-- umi url -->
[dumi-url]: https://img.shields.io/badge/docs%20by-dumi-blue
[father-url]: https://img.shields.io/badge/build%20with-father-028fe4.svg
<!-- npm url -->
<!-- coverage -->
<!-- Github CI -->
[download-url]: https://npmjs.org/package/@easyx.ai/dumi-theme-easyxai
</div>
## 简介
@easyx.ai/dumi-theme-easyxai 是为 dumi2 打造的一款文档站主题包,提供了更加美观、易用的研发与阅读体验
### 特性
- 💠 **现代化主题风格** : 本主题包采用了流动色、毛玻璃、光影质感、自然动效等现代化的设计表现手法,将界面以更加简约、美观的方式呈现,使得文档更加直观、易读、易用;
- 🌓 **亮暗色主题模式一键切换**: 基于 antd v5 自定义了亮色与暗色主题算法,默认提供美观易用的亮暗色主题。用户可以根据自己的喜好选择主题模式,在不同的光线环境下都能获得良好的阅读体验。
- 💅 **基于 Ant Design 与 CSSinJS**: 本主题包使用 antd 作为基础组件库,并使用了 CSSinJS 实现样式方案,帮助更好地控制样式的细节,提高样式的复用性和可维护性。底层使用了 [antd-style](https://github.com/ant-design/antd-style) 样式库,在书写样式上更加灵活、可读、易于维护。
- 🪄 **精美的语法高亮**: 本主题包提供准确、精美的语法高亮特性。底层采用了现代化的语法高亮库 Shiki 与 Prism,并提供了丰富的代码高亮方案,帮助用户更好地阅读代码;
- 🧩 **组件灵活复用**: 本主题包为本地主题定制提供了很高的灵活度,默认导出了主题包中的精品组件,可以将组件作为独立的模块进行复用,开发者可以在 dumi 本地主题包中自由组合使用;
- 📱 **移动端适配良好**: 本主题包对移动端适配良好,基于 CSSinJS 的灵活样式方案,多套布局实现轻而易举。用户多端操作体验一致且顺滑;
## 快速上手
### 安装
推荐使用 `pnpm` 安装
```bash
pnpm i @easyx.ai/dumi-theme-easyxai -D
```
### 使用
安装完毕后,使用 dumi 启动站点,dumi 会自动加载主题,即可开始使用。
配置详情查看 [文档配置](https://dumi-theme-easyxai.vercel.app/config)。
<!-- issues -->
[issues-url]: https://cnb.cool/easyxai/dumi-theme-easyxai/-/issues/new