首先,你需要安装@iconify/vue和unplugin-icons。@iconify/vue是Iconify在Vue中的适配器,而unplugin-icons是一个Vite插件,可以帮助你更方便地管理和引入图标。 bash pnpm add @iconify/vue pnpm add -D unplugin-icons 2. 在Vue3项目中引入Iconify 如果你使用的是Vite,你需要在vite.config.js中配置unplugin-ico...
我们需要unplugin-icons和unplugin-auto-import库支持。 npm i -D unplugin-icons unplugin-auto-import 文档资料 unplugin-icons - GitHub 模板范例 element-plus-best-practices/vite.config.ts 配置 vue.config.js constIcons=require("unplugin-icons/webpack") constIconsResolver=require("unplugin-icons/reso...
// 引用工具 import Icons from 'unplugin-icons/vite'; import IconsResolver from 'unplugin-icons/resolver'; import AutoImport from 'unplugin-auto-import/vite'; import Components from 'unplugin-vue-components/vite'; // plugins部分 Components({ dts: './src/components.d.ts', extensions: ['vue...
// 引用工具 import Icons from 'unplugin-icons/vite'; import IconsResolver from 'unplugin-icons/resolver'; import AutoImport from 'unplugin-auto-import/vite'; import Components from 'unplugin-vue-components/vite'; // plugins部分 Components({ dts: './src/components.d.ts', extensions: ['vue...
plugins: [vue(), Icons({})], }); 配置tsconfig.json 类型 "compilerOptions": { "types": ["unplugin-icons/types/vue"], } 此时就可以正常使用了’~icons‘是 unplugin-icons前缀约定 import IconMdl from "~icons/mdi-light/home"; <template> <IconMdl></...
import Icons from 'unplugin-icons/vite'; import IconsResolver from 'unplugin-icons/resolver'; import AutoImport from 'unplugin-auto-import/vite'; import Components from 'unplugin-vue-components/vite'; // plugins部分 Components({ dts: './src/components.d.ts', ...
vite-plugin-iconify GitHub 按需导入图标作为组件。 在 unplugin-icons 的基础上支持导入并优化 svg 文件(目录),组件属性静态替换成图标组件,更方便其它 UI 框架接入图标系统。 特性 🤹 任意图标集 - 超过 10,00...
unplugin/unplugin-icons Star4.3k 🤹 Access thousands of icons as components on-demand universally. reactwebpackvuejsxiconsnuxticonifyviteunplugin UpdatedFeb 18, 2025 TypeScript Mahmud0808/Iconify Star2.2k Code Issues Pull requests Discussions ...
{ "@iconify/tools": "^4.0.4", "unplugin-icons": "^0.19.0", "vue": "^2.7.16", "vue-template-es2015-compiler": "^1.9.1" }, "devDependencies": { "@antfu/eslint-config": "^2.16.2", "@storybook/addon-essentials": "^7.6.6", "@storybook/addon-interactions": "^7.6.6", "...
importIconsfrom"unplugin-icons/vite";importIconsResolverfrom"unplugin-icons/resolver"; vite配置 Components({resolvers:[ElementPlusResolver(),// 引入 ant-design-vue 图标IconsResolver({enabledCollections:["ep"],}),],}) Icons({autoInstall:true,}) ...