@blogger-hbs/ plugin- 杀灭剂
[尖叫声]
@blogger-hbs/plugin-lucide实验性,像blogger-hbs。它的API,选项和输出可以在任何发行中改变.
- 图标是部分的,
{{> lucide.house}},由单人<b:includable>只包含所用的图标. - 未知的图标名称和道具会以它们使用的地方和最接近的名称使构建失败.
使用量
pnpm add -D blogger-hbs @blogger-hbs/plugin-lucide
// blogger-hbs.config.ts
import { pluginLucide } from '@blogger-hbs/plugin-lucide';
import { defineConfig } from 'blogger-hbs';
export default defineConfig({
entry: 'src/index.hbs',
plugins: [pluginLucide()],
});
在主题中添加一次可包含的内容 Common 默认标记, 以便从任何地方包含, 然后使用图标 :
<b:defaultmarkups>
<b:defaultmarkup type='Common'>
{{> lucide.includable}}
</b:defaultmarkup>
</b:defaultmarkups>
{{> lucide.house}}
{{> lucide.menu size=16 class="icon"}}
博客只接受 <b:includable> 在部件或默认的标记中,部件本身的可包含内容只能用于该部件.
每个图标变成 <b:include data='{ name: "menu", size: "16", class: "icon" }' name='@lucide'/>。这些道具是 size, (中文(简体) ), stroke, (中文(简体) ), strokeWidth 财务报告和审定财务报表 class。 。 。 .
选项
| 选项 | 默认 | 说明 |
|---|---|---|
id | '@lucide' | 暗中渲染出图标. |
fallback | 'circle-slash' | 为一个名字提供的图标 无法隐藏的名称, false 用于空图标. |
size | 24 | 默认宽度和高度 . |
stroke | 'currentColor' | 默认中风颜色 . |
strokeWidth | 2 | 默认中风宽度 . |