0.0.4 • Published 2 years ago
pm-plugin-icons v0.0.4
pm-plugin-icons
统一图标库插件
- 开箱即用,无需配置
webpack loader
- 按需加载,不重复打包
- 支持单色和多色图标
- 多项目共享图标库,支持无限扩展
- 基于svgicon封装
安装
项目安装图标库
npm install pm-plugin-icons -S
# or
yarn add pm-plugin-icons -S
pm-plugin-icons/lib/svg-data
:图标数据json
格式pm-plugin-icons/lib/svg-icon
:原始图标svg
格式
项目使用
import PMPluginIcon from 'pm-plugin-icons'
Vue.use(PMPluginIcon)
包含组件
KIcon
字段 | 类型 | 描述 |
---|---|---|
data | Object | 组件数据,在目录下找pm-plugin-icons/lib/svg-data |
width | String /Number | 宽(px) |
height | String/Number | 高(px) |
color | String | 有效的颜色单位 |
scale | String/Number | 缩放比例 |
original | Boolean | (默认false)否是原图,true则color失效 |
dir | String | 方向up/down/lefe/right |
fill | Boolean | 是否描边,默认false |
<!-- 使用data同步加载图标 -->
<pm-icon :data="require('pm-plugin-icons/lib/svg-data/delete.json')"
width="36"
height="36"
></pm-icon>
添加图标
- 把图标复制到
pm-plugin-icons/lib/svg-icon
目录下,文件命名用小写单词 - 在
/lib/meta.json
配置对应的中文名称,方便搜索 - 执行
npm run release
发布 - 本地预览
npm run preview