// 加载css文件 这一步是可选的,你也可以直接在css文件中导入
import { loadCss } from "define-icon-element";
loadCss("xxx.css");
// define icon element
import defineIconElement from "define-icon-element";
defineIconElement("data-icon", { prefix: "icon-", class: "iconfont" });
// 加载js文件 这一步是可选的,你也可以直接在css文件中导入
import { loadJs } from "define-icon-element";
loadJs("xxx.js");
// define icon element
import defineIconElement from "define-icon-element";
defineIconElement("svg-icon", { prefix: "icon-", mode: "svg" });
<data-icon name="xxx" />
<data-icon name="xxx" size="16" />
<data-icon name="xxx" size="16" color="red" />
<svg-icon name="xxx" size="16" color="red" />
/**
* @desc defineIconElement
* @param {string} tagName - 用于在window中定义自定义元素的标签名
* @param {object} [props]
* @param {string|class} [props.mode = 'font'] - ['font'|'svg'] 字体从css文件加载时为font,字体从js文件加载时为svg
* @param {string} [props.prefix] - 拼写完整name的前缀
* @param {string} [props.class] - 插入额外的className
* @param {string} [props.color] - 指定默认颜色
* @param {number} [props.size] - 指定默认尺寸
* @param {object} [props.style] - 指定默认style; svg模式下会默认插入{display: 'inline-flex'}
* @param {function} [props.onInit] - 初始化节点后的回调
* @return {function} - IconHtmlElement class
*/