upd: icon add scss

src/packages/icon/index.scss

@@ -1,13 +1,13 @@
 @import '../../styles/font/iconfont.css';
 .nut-icon {
-  width: 20px;
-  height: 20px;
-  line-height: 20px;
+  width: $icon-width;
+  height: $icon-height;
+  line-height: $icon-line-height;
   text-align: right;
 
   &__img {
-    width: 20px;
-    height: 20px;
+    width: $icon-width;
+    height: $icon-height;
     object-fit: contain;
   }
 }

src/packages/icon/index.vue

@@ -5,26 +5,11 @@ const { componentName, create } = createComponent('icon');
 
 export default create({
   props: {
-    name: {
-      type: String,
-      default: ''
-    },
-    size: {
-      type: String,
-      default: ''
-    },
-    classPrefix: {
-      type: String,
-      default: 'nutui-iconfont'
-    },
-    color: {
-      type: String,
-      default: ''
-    },
-    tag: {
-      type: String as PropType<keyof HTMLElementTagNameMap>,
-      default: 'i'
-    }
+    name: { type: String, default: '' },
+    size: { type: String, default: '' },
+    classPrefix: { type: String, default: 'nutui-iconfont' },
+    color: { type: String, default: '' },
+    tag: { type: String as PropType<keyof HTMLElementTagNameMap>, default: 'i' }
   },
   emits: ['click'],
 
@@ -37,9 +22,10 @@ export default create({
     };
     const styleOptions = {
       class: `${props.classPrefix} ${componentName}-${props.name}`,
-      style: { color: props.color, fontSize: props.size },
-      onClick: handleClick
-    } as any;
+      style: { color: props.color, fontSize: props.size, width: '', height: '' },
+      onClick: handleClick,
+      src: ''
+    };
     if (isImage()) {
       styleOptions.class = `${componentName}__img`;
       styleOptions.src = props.name;

src/styles/variables.scss

@@ -86,3 +86,9 @@ $cell-title-font: $font-size-2;
 $cell-title-desc-font: $font-size-1;
 $cell-desc-font: $font-size-2;
 $cell-desc-color: $disable-color;
+
+// icon
+
+$icon-height: 20px;
+$icon-width: 20px;
+$icon-line-height: 20px;