Package Exports
- @waset/unplugin-iconify
- @waset/unplugin-iconify/astro
- @waset/unplugin-iconify/esbuild
- @waset/unplugin-iconify/farm
- @waset/unplugin-iconify/nuxt
- @waset/unplugin-iconify/rollup
- @waset/unplugin-iconify/rspack
- @waset/unplugin-iconify/types
- @waset/unplugin-iconify/vite
- @waset/unplugin-iconify/webpack
Readme
unplugin-iconify
Install
pnpm i -D @waset/unplugin-iconifyConfiguration
Iconify({
convert: {
icon: './icons',
svg: {
path: './icons',
noColor: true,
},
suffix: {
path: './icons',
noColor: true,
suffix: 'color',
},
},
output: 'dist/icons', // @default 'node_modules/.unplugin-iconify'
iconifyIntelliSense: true, // @default false
})如果开启
iconifyIntelliSense,将自动创建/更新.vscode/settings.json文件,用于 VSCode 插件 Iconify IntelliSenseconvert选项用于将图标转换为图标集,请查看src/core/types.ts获取更多类型信息。
Usage
Vite
// vite.config.ts
import Iconify from '@waset/unplugin-iconify/vite'
export default defineConfig({
plugins: [
Iconify({
// ...
})
],
})Nuxt
// nuxt.config.ts
import { defineNuxtConfig } from 'nuxt/config'
// https://nuxt.com/docs/api/configuration/nuxt-config
export default defineNuxtConfig({
modules: [
// ...
'@waset/unplugin-iconify/nuxt'
],
Iconify: {
// ...
},
})unocss
// uno.config.ts
import { UnocssLoader } from '@waset/unplugin-iconify/loader'
import { defineConfig, presetIcons } from 'unocss'
export default defineConfig({
presets: [
// ...
presetIcons({
scale: 1.2,
warn: true,
extraProperties: {
'display': 'inline-block',
'vertical-align': 'middle',
},
collections: {
...UnocssLoader(),
},
}),
],
// ...
})