https://github.com/imba97/hexo-unocss

支持在文章中使用 UnoCSS | Support using UnoCSS when writing articles
https://github.com/imba97/hexo-unocss

hexo unocss

Last synced: 2 months ago
JSON representation

支持在文章中使用 UnoCSS | Support using UnoCSS when writing articles

• Host: GitHub
• URL: https://github.com/imba97/hexo-unocss
• Owner: imba97
• License: mit
• Created: 2023-12-31T12:45:44.000Z (about 1 year ago)
• Default Branch: master
• Last Pushed: 2024-10-30T15:28:23.000Z (3 months ago)
• Last Synced: 2024-10-30T15:32:13.542Z (3 months ago)
• Topics: hexo, unocss
• Language: TypeScript
• Homepage:
• Size: 118 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# hexo-unocss

支持在文章中使用 UnoCSS

查看 [Demo](https://imba97.cn/archives/775/)

# 使用

## 安装依赖

安装插件和 UnoCSS

```bash

pnpm install hexo-unocss unocss

```

## 使用图标（可选）

全量安装图标库

```bash

pnpm install @iconify/json

```

图标站：[Icônes](https://icones.js.org/)

# 配置

## 插件配置

```yml

unocss:

  # 是否启用

  enable: true

  # 生成的样式文件

  # 以 source 为根目录

  file: css/uno.css

  # 扫描文件

  patterns:

    - 'source/**/*.md'

```

## UnoCSS 配置

配置完全沿用 UnoCSS 的配置，详情请参考 [https://unocss.dev/config/](https://unocss.dev/config/)

在根目录下新建 `uno.config.ts`，推荐以下配置。包含基础写法、属性写法、icon 的预设配置

```typescript

import { defineConfig, presetAttributify, presetIcons, presetUno } from 'unocss'

export default defineConfig({

  presets: [presetUno(), presetAttributify(), presetIcons()],

  content: {

    pipeline: {

      include: [/\.(md)($|\?)/]

    }

  }

})

```