perf-代码格式

src/App.vue

@@ -9,7 +9,7 @@
 
   onLaunch(() => {
     console.log('App Launch');
-    /** 微信小程序和阿里小程序动态远程加载字体 **/
+    /** 微信小程序和阿里小程序动态远程加载字体 * */
     /* #ifdef MP-WEIXIN || MP-ALIPAY */
     dynamicLoadFontFace();
     /* #endif */

src/androidPrivacy.json

@@ -1,29 +1,29 @@
 {
-    "version": "1",
+  "version": "1",
-    "prompt": "template",
+  "prompt": "template",
-    "title": "服务协议和隐私政策",
+  "title": "服务协议和隐私政策",
-    "message": "　　请你务必审慎阅读、充分理解“服务协议”和“隐私政策”各条款，包括但不限于：为了更好的向你提供服务，我们需要收集你的设备标识、操作日志等信息用于分析、优化应用性能。<br/>　　你可阅读<a href=\"\">《服务协议》</a>和<a href=\"\">《隐私政策》</a>了解详细信息。如果你同意，请点击下面按钮开始接受我们的服务。",
+  "message": "　　请你务必审慎阅读、充分理解“服务协议”和“隐私政策”各条款，包括但不限于：为了更好的向你提供服务，我们需要收集你的设备标识、操作日志等信息用于分析、优化应用性能。<br/>　　你可阅读<a href=\"\">《服务协议》</a>和<a href=\"\">《隐私政策》</a>了解详细信息。如果你同意，请点击下面按钮开始接受我们的服务。",
-    "buttonAccept": "同意并接受",
+  "buttonAccept": "同意并接受",
-    "buttonRefuse": "暂不同意",
+  "buttonRefuse": "暂不同意",
-    // HX 3.4.13之后版本新增，system 使用系统webview 打开隐私协议链接，默认使用uni-app内置web组件
+  // HX 3.4.13之后版本新增，system 使用系统webview 打开隐私协议链接，默认使用uni-app内置web组件
-    "hrefLoader": "default",
+  "hrefLoader": "default",
-    "second": {
+  "second": {
-        "title": "确认提示",
+    "title": "确认提示",
-        "message": "　　进入应用前，你需先同意<a href=\"\">《服务协议》</a>和<a href=\"\">《隐私政策》</a>，否则将退出应用。",
+    "message": "　　进入应用前，你需先同意<a href=\"\">《服务协议》</a>和<a href=\"\">《隐私政策》</a>，否则将退出应用。",
-        "buttonAccept": "同意并继续",
+    "buttonAccept": "同意并继续",
-        "buttonRefuse": "退出应用"
+    "buttonRefuse": "退出应用"
+  },
+  "styles": {
+    "backgroundColor": "#00FF00",
+    "borderRadius": "5px",
+    "title": {
+      "color": "#ff00ff"
     },
-    "styles": {
+    "buttonAccept": {
-        "backgroundColor": "#00FF00",
+      "color": "#ffff00"
-        "borderRadius":"5px",
+    },
-        "title": {
+    "buttonRefuse": {
-            "color": "#ff00ff"
+      "color": "#00ffff"
-        },
-        "buttonAccept": {
-            "color": "#ffff00"
-        },
-        "buttonRefuse": {
-            "color": "#00ffff"
-        }
     }
-}
+  }
+}

src/assets/style/main.scss

@@ -1,3 +1,3 @@
 @import 'auxiliary';
 @import 'mixin';
-@import 'flex';
+@import 'flex';

src/components/BasicButton/index.vue

@@ -9,7 +9,9 @@
 </script>
 
 <template>
-  <view class="default-btn" :disabled="props.disabled" @tap="click"><slot></slot></view>
+  <view class="default-btn" :disabled="props.disabled" @tap="click">
+    <slot></slot>
+  </view>
 </template>
 
 <style lang="scss" scoped>

src/components/BasicInput/index.vue

@@ -4,6 +4,7 @@
 
 <script lang="ts">
   import { defineComponent } from 'vue';
+
   export default defineComponent({
     name: 'BasicInput',
     props: {

src/components/FontAwesomeIcon/index.scss

@@ -1,9 +1,9 @@
-@import "scss/fontawesome";
+@import 'scss/fontawesome';
 
-@import "scss/solid";
+@import 'scss/solid';
-@import "scss/brands";
+@import 'scss/brands';
-@import "scss/regular";
+@import 'scss/regular';
-@import "scss/light";
+@import 'scss/light';
-@import "scss/thin";
+@import 'scss/thin';
-@import "scss/duotone";
+@import 'scss/duotone';
-@import "scss/sharp-solid";
+@import 'scss/sharp-solid';

src/components/FontAwesomeIcon/index.vue

@@ -19,7 +19,8 @@
   const singleBeat = props.beat && !props.fade;
   const singleFade = !props.beat && props.fade;
   const beatFade = props.beat && props.fade;
-  const count = props.counter > props.counterMax ? `${props.counterMax}+` : props.counter;
+  const count =
+    props.counter > props.counterMax ? `${props.counterMax}+` : props.counter;
   const wrapClassObject = [
     props.float ? `fa-pull-${props.float}` : '',
     props.border ? 'fa-border' : '',
@@ -53,7 +54,10 @@
     singleBeat ? { '--fa-beat-scale': `${props.scale}` } : {},
     singleFade ? { '--fa-fade-opacity': `${props.opacity}` } : {},
     beatFade
-      ? { '--fa-beat-fade-scale': `${props.scale}`, '--fa-beat-fade-opacity': `${props.opacity}` }
+      ? {
+          '--fa-beat-fade-scale': `${props.scale}`,
+          '--fa-beat-fade-opacity': `${props.opacity}`,
+        }
       : {},
     props.bounce
       ? {
@@ -137,14 +141,21 @@
   };
 </script>
 <template>
-  <view @click="onClick" class="icon-wrap" :class="wrapClassObject" :style="wrapStyleObject">
+  <view
+    @click="onClick"
+    class="icon-wrap"
+    :class="wrapClassObject"
+    :style="wrapStyleObject"
+  >
     <template v-if="props.stack">
       <slot :stack="props.stack"></slot>
     </template>
     <template v-else>
       <text class="icon" :style="iconStyleObject" :class="iconClassObject" />
     </template>
-    <text v-if="props.counter" class="counter" :style="counterStyleObject">{{ count }}</text>
+    <text v-if="props.counter" class="counter" :style="counterStyleObject">{{
+      count
+    }}</text>
   </view>
 </template>
 <style lang="scss" scoped>

src/components/FontAwesomeIcon/props.ts

@@ -1,4 +1,4 @@
-type StyleType = 'solid' | 'regular' | 'light' | 'thin' | 'duotone' | 'brands' | 'sharp';
+// type StyleType = 'solid' | 'regular' | 'light' | 'thin' | 'duotone' | 'brands' | 'sharp';
 
 export const FontAwesomeIconProps = {
   /** icon name
@@ -17,7 +17,14 @@ export const FontAwesomeIconProps = {
     default: 'solid',
     validator(value: string) {
       // The value must match one of these strings
-      return ['solid', 'regular', 'light', 'thin', 'duotone', 'brands'].includes(value);
+      return [
+        'solid',
+        'regular',
+        'light',
+        'thin',
+        'duotone',
+        'brands',
+      ].includes(value);
     },
   },
   /** icon sharp
@@ -126,26 +133,24 @@ export const FontAwesomeIconProps = {
    */
   bounceConfig: {
     type: Object,
-    default: () => {
+    default: () => ({
-      return {
+      // 设置图标在跳跃后着陆时的反弹量
-        // 设置图标在跳跃后着陆时的反弹量
+      rebound: '-0.125em',
-        rebound: '-0.125em',
+      // 设置图标弹跳时跳到的最大高度
-        // 设置图标弹跳时跳到的最大高度
+      height: '-0.5em',
-        height: '-0.5em',
+      // 设置图标开始反弹时的水平挤压
-        // 设置图标开始反弹时的水平挤压
+      startScaleX: '1.1',
-        startScaleX: '1.1',
+      // 设置图标开始反弹时的垂直挤压
-        // 设置图标开始反弹时的垂直挤压
+      startScaleY: '0.9',
-        startScaleY: '0.9',
+      // 设置图标弹跳时的水平挤压
-        // 设置图标弹跳时的水平挤压
+      jumpScaleX: '0.9',
-        jumpScaleX: '0.9',
+      // 设置图标弹跳时的垂直挤压
-        // 设置图标弹跳时的垂直挤压
+      jumpScaleY: '1.1',
-        jumpScaleY: '1.1',
+      // 设置图标弹跳后着陆时的水平挤压
-        // 设置图标弹跳后着陆时的水平挤压
+      landScaleX: '1.05',
-        landScaleX: '1.05',
+      // 设置图标弹跳后着陆时的垂直挤压
-        // 设置图标弹跳后着陆时的垂直挤压
+      landScaleY: '0.95',
-        landScaleY: '0.95',
+    }),
-      };
-    },
   },
   /**
    * icon flip
@@ -161,18 +166,16 @@ export const FontAwesomeIconProps = {
    */
   flipConfig: {
     type: Object,
-    default: () => {
+    default: () => ({
-      return {
+      // 设置旋转轴的 x 坐标（0~1）
-        // 设置旋转轴的 x 坐标（0~1）
+      x: '0',
-        x: '0',
+      // 设置旋转轴的 y 坐标（0~1)
-        // 设置旋转轴的 y 坐标（0~1)
+      y: '1',
-        y: '1',
+      // 设置旋转轴的 z 坐标（0~1)
-        // 设置旋转轴的 z 坐标（0~1)
+      z: '0',
-        z: '0',
+      // 设置翻转的旋转角度,正角表示顺时针旋转，负角表示逆时针旋转。
-        // 设置翻转的旋转角度,正角表示顺时针旋转，负角表示逆时针旋转。
+      angle: '-180deg',
-        angle: '-180deg',
+    }),
-      };
-    },
   },
   /**
    * icon shake
@@ -246,21 +249,19 @@ export const FontAwesomeIconProps = {
    */
   borderConfig: {
     type: Object,
-    default: () => {
+    default: () => ({
-      return {
+      // 设置边框颜色
-        // 设置边框颜色
+      color: '#eee',
-        color: '#eee',
+      // 设置图标周围的填充
-        // 设置图标周围的填充
+      padding: '.04em .26em',
-        padding: '.04em .26em',
+      // 设置边框半径
-        // 设置边框半径
+      radius: '.1em',
-        radius: '.1em',
+      // 设置边框样式
-        // 设置边框样式
+      // 可选值 solid(默认实线), dotted(点状边框),dashed(虚线),double(双线)
-        // 可选值 solid(默认实线), dotted(点状边框),dashed(虚线),double(双线)
+      style: 'solid',
-        style: 'solid',
+      // 设置边框宽度
-        // 设置边框宽度
+      width: '.08em',
-        width: '.08em',
+    }),
-      };
-    },
   },
   /**
    * icon float

src/components/FontAwesomeIcon/scss/_animated.scss

@@ -6,8 +6,14 @@
   animation-delay: var(--#{$fa-css-prefix}-animation-delay, 0s);
   animation-direction: var(--#{$fa-css-prefix}-animation-direction, normal);
   animation-duration: var(--#{$fa-css-prefix}-animation-duration, 1s);
-  animation-iteration-count: var(--#{$fa-css-prefix}-animation-iteration-count, infinite);
+  animation-iteration-count: var(
-  animation-timing-function: var(--#{$fa-css-prefix}-animation-timing, ease-in-out);
+    --#{$fa-css-prefix}-animation-iteration-count,
+    infinite
+  );
+  animation-timing-function: var(
+    --#{$fa-css-prefix}-animation-timing,
+    ease-in-out
+  );
 }
 
 .#{$fa-css-prefix}-bounce {
@@ -15,8 +21,14 @@
   animation-delay: var(--#{$fa-css-prefix}-animation-delay, 0s);
   animation-direction: var(--#{$fa-css-prefix}-animation-direction, normal);
   animation-duration: var(--#{$fa-css-prefix}-animation-duration, 1s);
-  animation-iteration-count: var(--#{$fa-css-prefix}-animation-iteration-count, infinite);
+  animation-iteration-count: var(
-  animation-timing-function: var(--#{$fa-css-prefix}-animation-timing, cubic-bezier(0.280, 0.840, 0.420, 1));
+    --#{$fa-css-prefix}-animation-iteration-count,
+    infinite
+  );
+  animation-timing-function: var(
+    --#{$fa-css-prefix}-animation-timing,
+    cubic-bezier(0.28, 0.84, 0.42, 1)
+  );
 }
 
 .#{$fa-css-prefix}-fade {
@@ -24,8 +36,14 @@
   animation-delay: var(--#{$fa-css-prefix}-animation-delay, 0s);
   animation-direction: var(--#{$fa-css-prefix}-animation-direction, normal);
   animation-duration: var(--#{$fa-css-prefix}-animation-duration, 1s);
-  animation-iteration-count: var(--#{$fa-css-prefix}-animation-iteration-count, infinite);
+  animation-iteration-count: var(
-  animation-timing-function: var(--#{$fa-css-prefix}-animation-timing, cubic-bezier(.4,0,.6,1));
+    --#{$fa-css-prefix}-animation-iteration-count,
+    infinite
+  );
+  animation-timing-function: var(
+    --#{$fa-css-prefix}-animation-timing,
+    cubic-bezier(0.4, 0, 0.6, 1)
+  );
 }
 
 .#{$fa-css-prefix}-beat-fade {
@@ -33,8 +51,14 @@
   animation-delay: var(--#{$fa-css-prefix}-animation-delay, 0s);
   animation-direction: var(--#{$fa-css-prefix}-animation-direction, normal);
   animation-duration: var(--#{$fa-css-prefix}-animation-duration, 1s);
-  animation-iteration-count: var(--#{$fa-css-prefix}-animation-iteration-count, infinite);
+  animation-iteration-count: var(
-  animation-timing-function: var(--#{$fa-css-prefix}-animation-timing, cubic-bezier(.4,0,.6,1));
+    --#{$fa-css-prefix}-animation-iteration-count,
+    infinite
+  );
+  animation-timing-function: var(
+    --#{$fa-css-prefix}-animation-timing,
+    cubic-bezier(0.4, 0, 0.6, 1)
+  );
 }
 
 .#{$fa-css-prefix}-flip {
@@ -42,8 +66,14 @@
   animation-delay: var(--#{$fa-css-prefix}-animation-delay, 0s);
   animation-direction: var(--#{$fa-css-prefix}-animation-direction, normal);
   animation-duration: var(--#{$fa-css-prefix}-animation-duration, 1s);
-  animation-iteration-count: var(--#{$fa-css-prefix}-animation-iteration-count, infinite);
+  animation-iteration-count: var(
-  animation-timing-function: var(--#{$fa-css-prefix}-animation-timing, ease-in-out);
+    --#{$fa-css-prefix}-animation-iteration-count,
+    infinite
+  );
+  animation-timing-function: var(
+    --#{$fa-css-prefix}-animation-timing,
+    ease-in-out
+  );
 }
 
 .#{$fa-css-prefix}-shake {
@@ -51,7 +81,10 @@
   animation-delay: var(--#{$fa-css-prefix}-animation-delay, 0s);
   animation-direction: var(--#{$fa-css-prefix}-animation-direction, normal);
   animation-duration: var(--#{$fa-css-prefix}-animation-duration, 1s);
-  animation-iteration-count: var(--#{$fa-css-prefix}-animation-iteration-count, infinite);
+  animation-iteration-count: var(
+    --#{$fa-css-prefix}-animation-iteration-count,
+    infinite
+  );
   animation-timing-function: var(--#{$fa-css-prefix}-animation-timing, linear);
 }
 
@@ -60,7 +93,10 @@
   animation-delay: var(--#{$fa-css-prefix}-animation-delay, 0s);
   animation-direction: var(--#{$fa-css-prefix}-animation-direction, normal);
   animation-duration: var(--#{$fa-css-prefix}-animation-duration, 2s);
-  animation-iteration-count: var(--#{$fa-css-prefix}-animation-iteration-count, infinite);
+  animation-iteration-count: var(
+    --#{$fa-css-prefix}-animation-iteration-count,
+    infinite
+  );
   animation-timing-function: var(--#{$fa-css-prefix}-animation-timing, linear);
 }
 
@@ -73,8 +109,14 @@
   animation-name: #{$fa-css-prefix}-spin;
   animation-direction: var(--#{$fa-css-prefix}-animation-direction, normal);
   animation-duration: var(--#{$fa-css-prefix}-animation-duration, 1s);
-  animation-iteration-count: var(--#{$fa-css-prefix}-animation-iteration-count, infinite);
+  animation-iteration-count: var(
-  animation-timing-function: var(--#{$fa-css-prefix}-animation-timing, steps(8));
+    --#{$fa-css-prefix}-animation-iteration-count,
+    infinite
+  );
+  animation-timing-function: var(
+    --#{$fa-css-prefix}-animation-timing,
+    steps(8)
+  );
 }
 
 // if agent or operating system prefers reduced motion, disable animations
@@ -99,26 +141,61 @@
 }
 
 @keyframes #{$fa-css-prefix}-beat {
-  0%, 90% { transform: scale(1); }
+  0%,
-  45% { transform: scale(var(--#{$fa-css-prefix}-beat-scale, 1.25)); }
+  90% {
+    transform: scale(1);
+  }
+  45% {
+    transform: scale(var(--#{$fa-css-prefix}-beat-scale, 1.25));
+  }
 }
 
 @keyframes #{$fa-css-prefix}-bounce {
-  0%   { transform: scale(1,1) translateY(0); }
+  0% {
-  10%  { transform: scale(var(--#{$fa-css-prefix}-bounce-start-scale-x, 1.1),var(--#{$fa-css-prefix}-bounce-start-scale-y, 0.9)) translateY(0); }
+    transform: scale(1, 1) translateY(0);
-  30%  { transform: scale(var(--#{$fa-css-prefix}-bounce-jump-scale-x, 0.9),var(--#{$fa-css-prefix}-bounce-jump-scale-y, 1.1)) translateY(var(--#{$fa-css-prefix}-bounce-height, -0.5em)); }
+  }
-  50%  { transform: scale(var(--#{$fa-css-prefix}-bounce-land-scale-x, 1.05),var(--#{$fa-css-prefix}-bounce-land-scale-y, 0.95)) translateY(0); }
+  10% {
-  57%  { transform: scale(1,1) translateY(var(--#{$fa-css-prefix}-bounce-rebound, -0.125em)); }
+    transform: scale(
-  64%  { transform: scale(1,1) translateY(0); }
+        var(--#{$fa-css-prefix}-bounce-start-scale-x, 1.1),
-  100% { transform: scale(1,1) translateY(0); }
+        var(--#{$fa-css-prefix}-bounce-start-scale-y, 0.9)
+      )
+      translateY(0);
+  }
+  30% {
+    transform: scale(
+        var(--#{$fa-css-prefix}-bounce-jump-scale-x, 0.9),
+        var(--#{$fa-css-prefix}-bounce-jump-scale-y, 1.1)
+      )
+      translateY(var(--#{$fa-css-prefix}-bounce-height, -0.5em));
+  }
+  50% {
+    transform: scale(
+        var(--#{$fa-css-prefix}-bounce-land-scale-x, 1.05),
+        var(--#{$fa-css-prefix}-bounce-land-scale-y, 0.95)
+      )
+      translateY(0);
+  }
+  57% {
+    transform: scale(1, 1)
+      translateY(var(--#{$fa-css-prefix}-bounce-rebound, -0.125em));
+  }
+  64% {
+    transform: scale(1, 1) translateY(0);
+  }
+  100% {
+    transform: scale(1, 1) translateY(0);
+  }
 }
 
 @keyframes #{$fa-css-prefix}-fade {
-  50% { opacity: var(--#{$fa-css-prefix}-fade-opacity, 0.4); }
+  50% {
+    opacity: var(--#{$fa-css-prefix}-fade-opacity, 0.4);
+  }
 }
 
 @keyframes #{$fa-css-prefix}-beat-fade {
-  0%, 100% {
+  0%,
+  100% {
     opacity: var(--#{$fa-css-prefix}-beat-fade-opacity, 0.4);
     transform: scale(1);
   }
@@ -130,24 +207,53 @@
 
 @keyframes #{$fa-css-prefix}-flip {
   50% {
-    transform: rotate3d(var(--#{$fa-css-prefix}-flip-x, 0), var(--#{$fa-css-prefix}-flip-y, 1), var(--#{$fa-css-prefix}-flip-z, 0), var(--#{$fa-css-prefix}-flip-angle, -180deg));
+    transform: rotate3d(
+      var(--#{$fa-css-prefix}-flip-x, 0),
+      var(--#{$fa-css-prefix}-flip-y, 1),
+      var(--#{$fa-css-prefix}-flip-z, 0),
+      var(--#{$fa-css-prefix}-flip-angle, -180deg)
+    );
   }
 }
 
 @keyframes #{$fa-css-prefix}-shake {
-  0% { transform: rotate(-15deg); }
+  0% {
-  4% { transform: rotate(15deg); }
+    transform: rotate(-15deg);
-  8%, 24% { transform: rotate(-18deg); }
+  }
-  12%, 28% { transform: rotate(18deg); }
+  4% {
-  16% { transform: rotate(-22deg); }
+    transform: rotate(15deg);
-  20% { transform: rotate(22deg); }
+  }
-  32% { transform: rotate(-12deg); }
+  8%,
-  36% { transform: rotate(12deg); }
+  24% {
-  40%, 100% { transform: rotate(0deg); }
+    transform: rotate(-18deg);
+  }
+  12%,
+  28% {
+    transform: rotate(18deg);
+  }
+  16% {
+    transform: rotate(-22deg);
+  }
+  20% {
+    transform: rotate(22deg);
+  }
+  32% {
+    transform: rotate(-12deg);
+  }
+  36% {
+    transform: rotate(12deg);
+  }
+  40%,
+  100% {
+    transform: rotate(0deg);
+  }
 }
 
 @keyframes #{$fa-css-prefix}-spin {
-  0% { transform: rotate(0deg); }
+  0% {
-  100% { transform: rotate(360deg); }
+    transform: rotate(0deg);
+  }
+  100% {
+    transform: rotate(360deg);
+  }
 }
-

src/components/FontAwesomeIcon/scss/_bordered-pulled.scss

@@ -9,12 +9,12 @@
   padding: var(--#{$fa-css-prefix}-border-padding, #{$fa-border-padding});
 }
 
-.#{$fa-css-prefix}-pull-left { 
+.#{$fa-css-prefix}-pull-left {
   float: left;
-  margin-right: var(--#{$fa-css-prefix}-pull-margin, #{$fa-pull-margin}); 
+  margin-right: var(--#{$fa-css-prefix}-pull-margin, #{$fa-pull-margin});
 }
 
-.#{$fa-css-prefix}-pull-right { 
+.#{$fa-css-prefix}-pull-right {
   float: right;
-  margin-left: var(--#{$fa-css-prefix}-pull-margin, #{$fa-pull-margin}); 
+  margin-left: var(--#{$fa-css-prefix}-pull-margin, #{$fa-pull-margin});
 }

src/components/FontAwesomeIcon/scss/_core.scss

@@ -24,8 +24,7 @@
 .#{$fa-css-prefix}-duotone,
 .fass,
 .#{$fa-css-prefix}-sharp,
-.#{$fa-css-prefix}-sharp-solid
+.#{$fa-css-prefix}-sharp-solid {
-{
   -moz-osx-font-smoothing: grayscale;
   -webkit-font-smoothing: antialiased;
   display: var(--#{$fa-css-prefix}-display, #{$fa-display});
@@ -42,13 +41,13 @@
 }
 .far,
 .#{$fa-css-prefix}-classic,
-.#{$fa-css-prefix}-regular{
+.#{$fa-css-prefix}-regular {
   font-family: $fa-style-family-regular;
 }
 
 .fal,
 .#{$fa-css-prefix}-classic,
-.#{$fa-css-prefix}-light{
+.#{$fa-css-prefix}-light {
   font-family: $fa-style-family-light;
 }
 
@@ -60,8 +59,7 @@
 
 .fat,
 .#{$fa-css-prefix}-classic,
-.#{$fa-css-prefix}-thin
+.#{$fa-css-prefix}-thin {
-{
   font-family: $fa-style-family-thin;
 }
 
@@ -70,13 +68,11 @@
   font-family: $fa-style-family-brands;
 }
 
-
 .fass,
 .#{$fa-css-prefix}-harp-solid.#{$fa-css-prefix}-solid {
   font-family: $fa-style-family-sharp-solid;
 }
 
-
 %fa-icon {
   @include fa-icon;
 }

src/components/FontAwesomeIcon/scss/_functions.scss

@@ -3,7 +3,7 @@
 
 // fa-content: convenience function used to set content property
 @function fa-content($fa-var) {
-  @return unquote("\"#{ $fa-var }\"");
+  @return unquote('"#{ $fa-var }"');
 }
 
 // fa-divide: Originally obtained from the Bootstrap https://github.com/twbs/bootstrap
@@ -51,7 +51,7 @@
     $remainder: $remainder - $divisor;
   }
   @if $remainder > 0 and $precision > 0 {
-    $remainder: fa-divide($remainder * 10, $divisor, $precision - 1) * .1;
+    $remainder: fa-divide($remainder * 10, $divisor, $precision - 1) * 0.1;
   }
   @return ($quotient + $remainder) * $sign;
 }

src/components/FontAwesomeIcon/scss/_icons.scss

@@ -5,11 +5,12 @@
 readers do not read off random characters that represent icons */
 
 @each $name, $icon in $fa-icons {
-  .#{$fa-css-prefix}-#{$name}::before { content: unquote("\"#{ $icon }\""); }
+  .#{$fa-css-prefix}-#{$name}::before {
+    content: unquote('"#{ $icon }"');
+  }
 }
 @each $name, $icon in $fa-icons {
-  .#{$fa-css-prefix}-duotone.#{$fa-css-prefix}-#{$name}::after { content: unquote("\"#{ $icon }#{ $icon }\""); }
+  .#{$fa-css-prefix}-duotone.#{$fa-css-prefix}-#{$name}::after {
+    content: unquote('"#{ $icon }#{ $icon }"');
+  }
 }
-
-
-

src/components/FontAwesomeIcon/scss/_list.scss

@@ -6,7 +6,9 @@
   margin-left: var(--#{$fa-css-prefix}-li-margin, #{$fa-li-margin});
   padding-left: 0;
 
-  > li { position: relative; }
+  > li {
+    position: relative;
+  }
 }
 
 .#{$fa-css-prefix}-li {

src/components/FontAwesomeIcon/scss/_mixins.scss

@@ -13,7 +13,7 @@
 }
 
 // sets relative font-sizing and alignment (in _sizing)
-@mixin fa-size ($font-size) {
+@mixin fa-size($font-size) {
   font-size: fa-divide($font-size, $fa-size-scale-base) * 1em; // converts step in sizing scale into an em-based value that's relative to the scale's base
   line-height: fa-divide(1, $font-size) * 1em; // sets the line-height of the icon back to that of it's parent
   vertical-align: (fa-divide(6, $font-size) - fa-divide(3, 8)) * 1em; // vertically centers the icon taking into account the surrounding text's descender
@@ -51,7 +51,7 @@
   @extend .fa-solid;
 
   &::before {
-    content: unquote("\"#{ $fa-var }\"");
+    content: unquote('"#{ $fa-var }"');
   }
 }
 
@@ -60,7 +60,7 @@
   @extend .fa-regular;
 
   &::before {
-    content: unquote("\"#{ $fa-var }\"");
+    content: unquote('"#{ $fa-var }"');
   }
 }
 
@@ -69,7 +69,7 @@
   @extend .fa-light;
 
   &::before {
-    content: unquote("\"#{ $fa-var }\"");
+    content: unquote('"#{ $fa-var }"');
   }
 }
 
@@ -78,7 +78,7 @@
   @extend .fa-thin;
 
   &::before {
-    content: unquote("\"#{ $fa-var }\"");
+    content: unquote('"#{ $fa-var }"');
   }
 }
 
@@ -87,7 +87,7 @@
   @extend .fa-sharp-solid;
 
   &::before {
-    content: unquote("\"#{ $fa-var }\"");
+    content: unquote('"#{ $fa-var }"');
   }
 }
 
@@ -96,7 +96,7 @@
   @extend .fa-duotone;
 
   &::before {
-    content: unquote("\"#{ $fa-var }\"");
+    content: unquote('"#{ $fa-var }"');
   }
 }
 
@@ -105,7 +105,6 @@
   @extend .fa-brands;
 
   &::before {
-    content: unquote("\"#{ $fa-var }\"");
+    content: unquote('"#{ $fa-var }"');
   }
 }
-

src/components/FontAwesomeIcon/scss/_rotated-flipped.scss

@@ -22,7 +22,7 @@
 }
 
 .#{$fa-css-prefix}-flip-both,
-.#{$fa-css-prefix}-flip-horizontal.#{$fa-css-prefix}-flip-vertical { 
+.#{$fa-css-prefix}-flip-horizontal.#{$fa-css-prefix}-flip-vertical {
   transform: scale(-1, -1);
 }
 

src/components/FontAwesomeIcon/scss/_sizing.scss

@@ -11,6 +11,6 @@
 // step-based scale (with alignment)
 @each $size, $value in $fa-sizes {
   .#{$fa-css-prefix}-#{$size} {
-     @include fa-size($value);
+    @include fa-size($value);
   }
 }

src/components/FontAwesomeIcon/scss/brands.scss

@@ -8,9 +8,11 @@
 /* #ifndef MP-WEIXIN || MP-ALIPAY */
 @import 'fonts/fa-brands-400';
 
-:root, :host {
+:root,
+:host {
   --#{$fa-css-prefix}-style-family-brands: $fa-style-family-brands;
-  --#{$fa-css-prefix}-font-brands: normal 400 1em/1 '#{ $fa-style-family-brands }';
+  --#{$fa-css-prefix}-font-brands: normal 400 1em/1
+    '#{ $fa-style-family-brands }';
 }
 
 @font-face {
@@ -20,8 +22,8 @@
   font-display: $fa-font-display;
 
   /* #ifdef H5 */
-  src:  url("#{$fa-font-path}/fa-brands-400.woff2") format('woff2'),
+  src: url('#{$fa-font-path}/fa-brands-400.woff2') format('woff2'),
-  url("#{$fa-font-path}/fa-brands-400.ttf") format('truetype');
+    url('#{$fa-font-path}/fa-brands-400.ttf') format('truetype');
   /* #endif */
 
   /* #ifndef H5 */
@@ -37,5 +39,7 @@
 }
 
 @each $name, $icon in $fa-brand-icons {
-  .#{$fa-css-prefix}-#{$name}:before { content: unquote("\"#{ $icon }\""); }
+  .#{$fa-css-prefix}-#{$name}:before {
+    content: unquote('"#{ $icon }"');
+  }
 }

src/components/FontAwesomeIcon/scss/duotone.scss

@@ -8,9 +8,11 @@
 /* #ifndef MP-WEIXIN || MP-ALIPAY */
 @import 'fonts/fa-duotone-900';
 
-:root, :host {
+:root,
+:host {
   --#{$fa-css-prefix}-style-family-classic: $fa-style-family-duotone;
-  --#{$fa-css-prefix}-font-duotone: normal 900 1em/1 '#{ $fa-style-family-duotone }';
+  --#{$fa-css-prefix}-font-duotone: normal 900 1em/1
+    '#{ $fa-style-family-duotone }';
 }
 
 @font-face {
@@ -19,15 +21,14 @@
   font-weight: 900;
   font-display: $fa-font-display;
   /* #ifdef H5 */
-  src:  url("#{$fa-font-path}/fa-duotone-900.woff2") format('woff2'),
+  src: url('#{$fa-font-path}/fa-duotone-900.woff2') format('woff2'),
-  url("#{$fa-font-path}/fa-duotone-900.ttf") format('truetype');
+    url('#{$fa-font-path}/fa-duotone-900.ttf') format('truetype');
   /* #endif */
 
   /* #ifndef H5 */
   src: $fa-duotone-900-woff2;
   // $fa-duotone-900-ttf;
   /* #endif */
-
 }
 /* #endif */
 
@@ -37,21 +38,22 @@
 }
 
 .fad:before,
-.#{$fa-css-prefix}-duotone:before{
+.#{$fa-css-prefix}-duotone:before {
   position: absolute;
   color: $fa-primary-color;
   opacity: $fa-primary-opacity;
 }
 
-.#{$fa-css-prefix}-duotone.#{$fa-css-prefix}-swap-opacity:before, 
+.#{$fa-css-prefix}-duotone.#{$fa-css-prefix}-swap-opacity:before,
-.#{$fa-css-prefix}-duotone:after, .#{$fa-css-prefix}-swap-opacity 
+.#{$fa-css-prefix}-duotone:after,
-.#{$fa-css-prefix}-duotone:before, .#{$fa-css-prefix}-swap-opacity 
+.#{$fa-css-prefix}-swap-opacity .#{$fa-css-prefix}-duotone:before,
-.fad:before, 
+.#{$fa-css-prefix}-swap-opacity .fad:before,
-.fad.#{$fa-css-prefix}-swap-opacity:before, 
+.fad.#{$fa-css-prefix}-swap-opacity:before,
 .fad:after {
   opacity: $fa-secondary-opacity;
 }
 
-.#{$fa-css-prefix}-duotone:after, .fad:after {
+.#{$fa-css-prefix}-duotone:after,
+.fad:after {
   color: $fa-secondary-color;
-}
+}

src/components/FontAwesomeIcon/scss/light.scss

@@ -8,7 +8,8 @@
 /* #ifndef MP-WEIXIN || MP-ALIPAY */
 @import 'fonts/fa-light-300';
 
-:root, :host {
+:root,
+:host {
   --#{$fa-css-prefix}-style-family-classic: $fa-style-family-light;
   --#{$fa-css-prefix}-font-light: normal 300 1em/1 '#{ $fa-style-family-light }';
 }
@@ -19,12 +20,12 @@
   font-weight: 300;
   font-display: $fa-font-display;
   /* #ifdef H5 */
-  src:  url("#{$fa-font-path}/fa-light-300.woff2") format('woff2'),
+  src: url('#{$fa-font-path}/fa-light-300.woff2') format('woff2'),
-  url("#{$fa-font-path}/fa-light-300.ttf") format('truetype');
+    url('#{$fa-font-path}/fa-light-300.ttf') format('truetype');
   /* #endif */
 
   /* #ifndef H5 */
-  src:  $fa-light-300-woff2;
+  src: $fa-light-300-woff2;
   //  $fa-light-300-ttf;
   /* #endif */
 }
@@ -33,4 +34,4 @@
 .far,
 .#{$fa-css-prefix}-light {
   font-weight: 300;
-}
+}

src/components/FontAwesomeIcon/scss/regular.scss

@@ -8,9 +8,11 @@
 /* #ifndef MP-WEIXIN || MP-ALIPAY */
 @import 'fonts/fa-regular-400';
 
-:root, :host {
+:root,
+:host {
   --#{$fa-css-prefix}-style-family-classic: $fa-style-family-regular;
-  --#{$fa-css-prefix}-font-regular: normal 400 1em/1 '#{ $fa-style-family-regular }';
+  --#{$fa-css-prefix}-font-regular: normal 400 1em/1
+    '#{ $fa-style-family-regular }';
 }
 
 @font-face {
@@ -19,16 +21,16 @@
   font-weight: 400;
   font-display: $fa-font-display;
   /* #ifdef H5 */
-  src:  url("#{$fa-font-path}/fa-regular-400.woff2") format('woff2'),
+  src: url('#{$fa-font-path}/fa-regular-400.woff2') format('woff2'),
-  url("#{$fa-font-path}/fa-regular-400.ttf") format('truetype');
+    url('#{$fa-font-path}/fa-regular-400.ttf') format('truetype');
   /* #endif */
 
   /* #ifndef H5 */
   src: $fa-regular-400-woff2;
   // $fa-regular-400-ttf;
-    
+
   /* #endif */
-  }
+}
 /* #endif */
 
 .far,

src/components/FontAwesomeIcon/scss/sharp-solid.scss

@@ -8,9 +8,11 @@
 /* #ifndef MP-WEIXIN || MP-ALIPAY */
 @import 'fonts/fa-sharp-solid-900';
 
-:root, :host {
+:root,
+:host {
   --#{$fa-css-prefix}-style-family-sharp: $fa-style-family-sharp-solid;
-  --#{$fa-css-prefix}-font-sharp-solid: normal 900 1em/1 '#{ $fa-style-family-sharp-solid }';
+  --#{$fa-css-prefix}-font-sharp-solid: normal 900 1em/1
+    '#{ $fa-style-family-sharp-solid }';
 }
 
 @font-face {
@@ -19,8 +21,8 @@
   font-weight: 900;
   font-display: $fa-font-display;
   /* #ifdef H5 */
-  src:  url("#{$fa-font-path}/fa-sharp-solid-900.woff2") format('woff2'),
+  src: url('#{$fa-font-path}/fa-sharp-solid-900.woff2') format('woff2'),
-  url("#{$fa-font-path}/fa-sharp-solid-900.ttf") format('truetype');
+    url('#{$fa-font-path}/fa-sharp-solid-900.ttf') format('truetype');
   /* #endif */
 
   /* #ifndef H5 */
@@ -33,4 +35,4 @@
 .far,
 .#{$fa-css-prefix}-sharp-solid {
   font-weight: 900;
-}
+}

src/components/FontAwesomeIcon/scss/solid.scss

@@ -8,19 +8,21 @@
 /* #ifndef MP-WEIXIN || MP-ALIPAY */
 @import 'fonts/fa-solid-900';
 
-:root, :host {
+:root,
-  --#{$fa-css-prefix}-style-family-classic: $fa-style-family-solid ;
+:host {
-  --#{$fa-css-prefix}-font-solid: normal 900 1em/1 '#{ $fa-style-family-solid  }';
+  --#{$fa-css-prefix}-style-family-classic: $fa-style-family-solid;
+  --#{$fa-css-prefix}-font-solid: normal 900 1em/1
+    '#{ $fa-style-family-solid  }';
 }
 
 @font-face {
-  font-family: $fa-style-family-solid ;
+  font-family: $fa-style-family-solid;
   font-style: normal;
   font-weight: 900;
   font-display: $fa-font-display;
   /* #ifdef H5 */
-  src:  url("#{$fa-font-path}/fa-solid-900.woff2") format('woff2'),
+  src: url('#{$fa-font-path}/fa-solid-900.woff2') format('woff2'),
-  url("#{$fa-font-path}/fa-solid-900.ttf") format('truetype');
+    url('#{$fa-font-path}/fa-solid-900.ttf') format('truetype');
   /* #endif */
 
   /* #ifndef H5 */

src/components/FontAwesomeIcon/scss/thin.scss

@@ -8,7 +8,8 @@
 /* #ifndef MP-WEIXIN || MP-ALIPAY */
 @import 'fonts/fa-thin-100';
 
-:root, :host {
+:root,
+:host {
   --#{$fa-css-prefix}-style-family-classic: $fa-style-family-thin;
   --#{$fa-css-prefix}-font-thin: normal 100 1em/1 '#{ $fa-style-family-thin }';
 }
@@ -19,8 +20,8 @@
   font-weight: 100;
   font-display: $fa-font-display;
   /* #ifdef H5 */
-  src:  url("#{$fa-font-path}/fa-thin-100.woff2") format('woff2'),
+  src: url('#{$fa-font-path}/fa-thin-100.woff2') format('woff2'),
-  url("#{$fa-font-path}/fa-thin-100.ttf") format('truetype');
+    url('#{$fa-font-path}/fa-thin-100.ttf') format('truetype');
   /* #endif */
 
   /* #ifndef H5 */
@@ -33,4 +34,4 @@
 .far,
 .#{$fa-css-prefix}-thin {
   font-weight: 100;
-}
+}

src/components/Template/index.vue

@@ -1,24 +0,0 @@
-<template>
-  <view>{{ name }}</view>
-  <view> 组件模板,新建components,将此页面内容复制粘贴到新建.vue文件 </view>
-</template>
-
-<script lang="ts">
-  import { defineComponent } from 'vue';
-  export default defineComponent({
-    name: 'Template',
-    props: {
-      name: {
-        type: String,
-        default: 'Template',
-      },
-    },
-    setup(props) {
-      const test = 'Test';
-      const name = props.name;
-      return { test, name };
-    },
-  });
-</script>
-
-<style lang="scss" scoped></style>

src/demo/example/fontAwesomeIcon/index.vue

@@ -1,7 +1,7 @@
 <script lang="ts" setup>
+  import { ref } from 'vue';
   import AppProvider from '@/components/AppProvider/inedx.vue';
   import FontAwesomeIcon from '@/components/FontAwesomeIcon/index.vue';
-  import { ref } from 'vue';
   import { SetClipboardData } from '@/utils/uniapi';
 
   const iconLink = ref('https://fontawesome.com/icons');
@@ -16,7 +16,8 @@
     <view class="tip">
       Tip: 由于字体文件太大,共7种风格图标, 7个字体文件,
       <!-- #ifdef MP-WEIXIN || MP-ALIPAY -->
-      微信小程序和阿里小程序动态远程加载font awesome 字体, 在\src\utils\fonts.ts中配置,
+      微信小程序和阿里小程序动态远程加载font awesome 字体,
+      在\src\utils\fonts.ts中配置,
       <!-- #endif -->
       <!-- #ifdef APP-PLUS -->
       APP加载font awesome 字体, 在\src\utils\fonts.ts中配置,
@@ -37,7 +38,10 @@
     <view> <FontAwesomeIcon mode="light" name="grid-2" />light grid-2</view>
     <view> <FontAwesomeIcon mode="light" name="house" />light</view>
     <view> <FontAwesomeIcon mode="thin" name="house" />thin</view>
-    <view> <FontAwesomeIcon mode="duotone" name="trash-can-clock" />duotone trash-can-clock</view>
+    <view>
+      <FontAwesomeIcon mode="duotone" name="trash-can-clock" />duotone
+      trash-can-clock</view
+    >
     <view> <FontAwesomeIcon mode="duotone" name="house" />duotone house</view>
     <view class="title">sharp-直角图标(只支持大部分solid),对应sharp字体</view>
     <view> <FontAwesomeIcon name="user" sharp counter="999" /> sharp </view>
@@ -49,11 +53,24 @@
     <view class="title">color-颜色</view>
     <view> <FontAwesomeIcon name="house" />默认 </view>
     <view> <FontAwesomeIcon name="house" color="Tomato" />Tomato </view>
-    <view> <FontAwesomeIcon mode="regular" name="house" color="Dodgerblue" />Dodgerblue</view>
     <view>
-      <FontAwesomeIcon mode="light" name="house" color="Mediumslateblue" />Mediumslateblue</view
+      <FontAwesomeIcon
+        mode="regular"
+        name="house"
+        color="Dodgerblue"
+      />Dodgerblue</view
     >
-    <view> <FontAwesomeIcon mode="brands" name="bilibili" color="Dodgerblue" /> Dodgerblue </view>
+    <view>
+      <FontAwesomeIcon
+        mode="light"
+        name="house"
+        color="Mediumslateblue"
+      />Mediumslateblue</view
+    >
+    <view>
+      <FontAwesomeIcon mode="brands" name="bilibili" color="Dodgerblue" />
+      Dodgerblue
+    </view>
 
     <view class="title">size-大小(单位rpx)</view>
     <view> <FontAwesomeIcon mode="light" name="house" />(默认)</view>
@@ -62,21 +79,47 @@
     <view> <FontAwesomeIcon mode="duotone" name="house" size="64" />64rpx</view>
     <view class="title">bgColor-背景色</view>
     <view> <FontAwesomeIcon name="house" bg-color="DodgerBlue" />solid </view>
-    <view> <FontAwesomeIcon mode="regular" name="house" bg-color="SkyBlue" />regular</view>
+    <view>
+      <FontAwesomeIcon
+        mode="regular"
+        name="house"
+        bg-color="SkyBlue"
+      />regular</view
+    >
     <view class="title">rotate-旋转角度</view>
-    <view> <FontAwesomeIcon mode="duotone" name="house" rotate="63" />house 63</view>
+    <view>
-    <view> <FontAwesomeIcon mode="duotone" name="snowboarding" rotate="58" />snowboarding 58</view>
+      <FontAwesomeIcon mode="duotone" name="house" rotate="63" />house 63</view
+    >
+    <view>
+      <FontAwesomeIcon
+        mode="duotone"
+        name="snowboarding"
+        rotate="58"
+      />snowboarding 58</view
+    >
     <view class="title">rotateFlip-旋转-翻转</view>
     <view> <FontAwesomeIcon mode="duotone" name="snowboarding" />正常</view>
     <view>
-      <FontAwesomeIcon mode="duotone" name="snowboarding" rotate-flip="horizontal" />
+      <FontAwesomeIcon
+        mode="duotone"
+        name="snowboarding"
+        rotate-flip="horizontal"
+      />
       水平翻转
     </view>
     <view>
-      <FontAwesomeIcon mode="duotone" name="snowboarding" rotate-flip="vertical" />垂直翻转
+      <FontAwesomeIcon
+        mode="duotone"
+        name="snowboarding"
+        rotate-flip="vertical"
+      />垂直翻转
     </view>
     <view>
-      <FontAwesomeIcon mode="duotone" name="snowboarding" rotate-flip="both" />垂直水平翻转
+      <FontAwesomeIcon
+        mode="duotone"
+        name="snowboarding"
+        rotate-flip="both"
+      />垂直水平翻转
     </view>
     <view class="title">beat-缩放动画</view>
     <FontAwesomeIcon name="circle-plus" beat />
@@ -90,7 +133,14 @@
     <view class="title">opacity-透明度值 </view>
     <FontAwesomeIcon name="heart" fade opacity="0.2" />
     <view class="title">beat+fade-跳动+淡入淡出动画 </view>
-    <FontAwesomeIcon name="heart" beat fade opacity="0.68" duration="1.5" scale="2.0" />
+    <FontAwesomeIcon
+      name="heart"
+      beat
+      fade
+      opacity="0.68"
+      duration="1.5"
+      scale="2.0"
+    />
     <view class="title">bounce-弹跳动画 </view>
     <FontAwesomeIcon name="basketball" bounce />
     <FontAwesomeIcon name="volleyball" bounce />
@@ -131,18 +181,28 @@
     <FontAwesomeIcon name="circle-notch" spin duration="1.5" />
     <FontAwesomeIcon name="cog" spin duration="2" />
     <FontAwesomeIcon name="cog" spin spin-reverse duration="15" />
-    <FontAwesomeIcon name="spinner" spin spin-pulse spinDelay="5s" duration="2" />
+    <FontAwesomeIcon
+      name="spinner"
+      spin
+      spin-pulse
+      spin-delay="5s"
+      duration="2"
+    />
     <FontAwesomeIcon
       name="spinner"
       spin
       spin-pulse
       spin-reverse
-      spinIterationCount="3"
+      spin-iteration-count="3"
       duration="2"
     />
     <view class="title">border-边框</view>
     <FontAwesomeIcon name="arrow-right" border />
-    <FontAwesomeIcon name="arrow-right" border :borderConfig="{ color: '#000' }" />
+    <FontAwesomeIcon
+      name="arrow-right"
+      border
+      :border-config="{ color: '#000' }"
+    />
 
     <view class="title">counter-计数</view>
     <view> <FontAwesomeIcon mode="light" name="house" counter="999" />99+</view>
@@ -156,8 +216,17 @@
     <view class="title" style="clear: both">stack-堆叠</view>
     <FontAwesomeIcon stack>
       <template #default="slotProps">
-        <FontAwesomeIcon name="circle" :stackChild="slotProps.stack" stack-x="2" />
+        <FontAwesomeIcon
-        <FontAwesomeIcon name="flag" :stackChild="slotProps.stack" stackInverse stack-x="1" />
+          name="circle"
+          :stack-child="slotProps.stack"
+          stack-x="2"
+        />
+        <FontAwesomeIcon
+          name="flag"
+          :stack-child="slotProps.stack"
+          stack-inverse
+          stack-x="1"
+        />
       </template>
     </FontAwesomeIcon>
     <FontAwesomeIcon stack flip>
@@ -165,12 +234,16 @@
         <FontAwesomeIcon
           mode="brands"
           name="twitter"
-          :stackChild="slotProps.stack"
+          :stack-child="slotProps.stack"
-          stackInverse
+          stack-inverse
-          stackZIndex="2"
+          stack-z-index="2"
           stack-x="1"
         />
-        <FontAwesomeIcon name="square" :stackChild="slotProps.stack" stack-x="2" />
+        <FontAwesomeIcon
+          name="square"
+          :stack-child="slotProps.stack"
+          stack-x="2"
+        />
       </template>
     </FontAwesomeIcon>
 
@@ -179,37 +252,49 @@
         <FontAwesomeIcon
           mode="brands"
           name="twitter"
-          :stackChild="slotProps.stack"
+          :stack-child="slotProps.stack"
-          stackInverse
+          stack-inverse
-          stackInverseColor="#1da1f2"
+          stack-inverse-color="#1da1f2"
-          stackZIndex="2"
+          stack-z-index="2"
           stack-x="1"
         />
-        <FontAwesomeIcon name="square" :stackChild="slotProps.stack" stack-x="2" />
+        <FontAwesomeIcon
+          name="square"
+          :stack-child="slotProps.stack"
+          stack-x="2"
+        />
       </template>
     </FontAwesomeIcon>
 
     <FontAwesomeIcon stack shake>
       <template #default="slotProps">
-        <FontAwesomeIcon name="camera" :stackChild="slotProps.stack" stack-x="1" />
+        <FontAwesomeIcon
+          name="camera"
+          :stack-child="slotProps.stack"
+          stack-x="1"
+        />
         <FontAwesomeIcon
           name="ban"
-          :stackChild="slotProps.stack"
+          :stack-child="slotProps.stack"
-          stackInverseColor="Tomato"
+          stack-inverse-color="Tomato"
-          stackInverse
+          stack-inverse
           stack-x="2"
         />
       </template>
     </FontAwesomeIcon>
     <FontAwesomeIcon stack rotate="45">
       <template #default="slotProps">
-        <FontAwesomeIcon name="square" :stackChild="slotProps.stack" stack-x="2" />
+        <FontAwesomeIcon
+          name="square"
+          :stack-child="slotProps.stack"
+          stack-x="2"
+        />
         <FontAwesomeIcon
           name="terminal"
           rotate="-45"
-          :stackChild="slotProps.stack"
+          :stack-child="slotProps.stack"
-          stackInverseColor="Tomato"
+          stack-inverse-color="Tomato"
-          stackInverse
+          stack-inverse
           stack-x="1"
         />
       </template>

src/enums/routerEnum.ts

@@ -6,7 +6,12 @@ export enum NAVIGATE_TYPE {
   NAVIGATE_BACK = 'navigateBack',
 }
 
-export const NAVIGATE_TYPE_LIST = ['navigateTo', 'redirectTo', 'reLaunch', 'switchTab'];
+export const NAVIGATE_TYPE_LIST = [
+  'navigateTo',
+  'redirectTo',
+  'reLaunch',
+  'switchTab',
+];
 
 export const HOME_PAGE = '/pages/index/index';
 export const LOGIN_PAGE = '/pages/login/index';

src/pages/about/index.vue

@@ -1,10 +1,11 @@
 <script lang="ts" setup>
+  import { ref } from 'vue';
+  import { onShow } from '@dcloudio/uni-app';
   import BasicButton from '@/components/BasicButton/index.vue';
   import AppProvider from '@/components/AppProvider/inedx.vue';
   import { useAuthStore } from '@/state/modules/auth';
-  import { ref } from 'vue';
-  import { onShow } from '@dcloudio/uni-app';
   import { useRouter } from '@/hooks/router';
+
   const authStore = useAuthStore();
   const isLogin = ref(false);
   const router = useRouter();
@@ -40,9 +41,11 @@
       <view class="cell" v-if="isLogin"
         ><BasicButton @click="handleLoginOut">登出</BasicButton></view
       >
-      <view class="cell" v-else
+      <view class="cell" v-else>
-        ><BasicButton @click="handleJump('/pages/login/index')">登入</BasicButton></view
+        <BasicButton @click="handleJump('/pages/login/index')">
-      >
+          登入
+        </BasicButton>
+      </view>
     </view>
   </AppProvider>
 </template>

src/pages/index/index.vue

@@ -1,8 +1,8 @@
 <script setup lang="ts">
+  import { ref } from 'vue';
   import BasicButton from '@/components/BasicButton/index.vue';
   import AppProvider from '@/components/AppProvider/inedx.vue';
   import FontAwesomeIcon from '@/components/FontAwesomeIcon/index.vue';
-  import { ref } from 'vue';
   import { useRouter } from '@/hooks/router';
   import { CURRENT_PLATFORM, PLATFORMS } from '@/enums/platformEnum';
   import { judgePlatform } from '@/utils/platform';

src/pages/log/index.vue

@@ -4,7 +4,8 @@
 
 <script lang="ts" setup>
   import { onLoad } from '@dcloudio/uni-app';
-  onLoad((query) => {
+
+  onLoad(query => {
     console.log('log onLoad', query);
   });
 </script>

src/pages/login/index.vue

@@ -1,12 +1,15 @@
 <script setup lang="ts">
   import { reactive, ref } from 'vue';
-  import { useAuthStore } from '@/state/modules/auth';
   import { onLoad } from '@dcloudio/uni-app';
+  import { useAuthStore } from '@/state/modules/auth';
   import { Toast } from '@/utils/uniapi/prompt';
   import { useRouter } from '@/hooks/router';
+
   const redirect = ref<string | undefined>(undefined);
-  onLoad((query) => {
+  onLoad(query => {
-    redirect.value = query.redirect ? decodeURIComponent(query.redirect) : undefined;
+    redirect.value = query.redirect
+      ? decodeURIComponent(query.redirect)
+      : undefined;
   });
 
   const router = useRouter();
@@ -37,7 +40,9 @@
       <form class="form" @submit="submit">
         <label class="form-item">
           <view class="form-label">邮箱:</view>
-          <view class="form-element"><input name="email" :value="form.email" /></view>
+          <view class="form-element"
+            ><input name="email" :value="form.email"
+          /></view>
         </label>
         <label class="form-item">
           <view class="form-label">密码:</view>
@@ -45,7 +50,9 @@
             ><input type="password" name="password" :value="form.password"
           /></view>
         </label>
-        <button form-type="submit" class="submit-btn" hover-class="none">登录</button>
+        <button form-type="submit" class="submit-btn" hover-class="none"
+          >登录</button
+        >
       </form>
     </view>
   </view>

src/pages/notFound/404.vue

@@ -7,7 +7,7 @@
   const go = ref<string>('');
   const router = useRouter();
   const redirect = ref<string>('');
-  onLoad((query) => {
+  onLoad(query => {
     go.value = query.go || '';
     redirect.value = query.redirect || '';
   });

src/pagesB/detail/index.vue

@@ -1,6 +1,6 @@
 <script lang="ts" setup>
-  import { useRoute } from '@/hooks/router';
   import { onLoad } from '@dcloudio/uni-app';
+  import { useRoute } from '@/hooks/router';
 
   // const route = useRoute();
 

src/state/modules/auth.ts

@@ -1,8 +1,7 @@
 import { defineStore } from 'pinia';
 import { getCache, removeCache, setCache } from '@/utils/cache';
 import { TOKEN_KEY } from '@/enums/cacheEnum';
-import { login } from '@/services/api/auth';
+import { login, logout, refreshToken } from '@/services/api/auth';
-import { logout, refreshToken } from '@/services/api/auth';
 
 interface AuthState {
   token?: string;
@@ -14,12 +13,8 @@ export const useAuthStore = defineStore({
     token: undefined,
   }),
   getters: {
-    getToken: (state) => {
+    getToken: state => state.token,
-      return state.token;
+    isLogin: (state): boolean => !!state.token,
-    },
-    isLogin: (state): boolean => {
-      return !!state.token;
-    },
   },
   actions: {
     initToken() {

src/utils/cache/index.ts

@@ -16,7 +16,11 @@ const options: Partial<CreateStorageParams> = {
 
 export const storage = createStorage(options);
 
-export function setCache(key: string, value: any, expire?: number | null): void {
+export function setCache(
+  key: string,
+  value: any,
+  expire?: number | null,
+): void {
   storage.set(key, value, expire);
 }
 

src/utils/cache/storageCache.ts

@@ -15,7 +15,7 @@ export const createStorage = ({
   timeout = null,
   hasEncrypt = true,
 }: Partial<CreateStorageParams> = {}) => {
-  if (hasEncrypt && [key.length, iv.length].some((item) => item !== 16)) {
+  if (hasEncrypt && [key.length, iv.length].some(item => item !== 16)) {
     throw new Error('When hasEncrypt is true, the key or iv must be 16 bits!');
   }
 
@@ -29,8 +29,11 @@ export const createStorage = ({
    */
   class Storage {
     private prefixKey?: string;
+
     private encryption: AesEncryption;
+
     private hasEncrypt: boolean;
+
     /**
      *
      * @param {*} storage
@@ -57,7 +60,9 @@ export const createStorage = ({
         const stringData = JSON.stringify({
           value,
           time: Date.now(),
-          expire: !isNullOrUnDef(expire) ? new Date().getTime() + expire * 1000 : null,
+          expire: !isNullOrUnDef(expire)
+            ? new Date().getTime() + expire * 1000
+            : null,
         });
         const stringifyValue = this.hasEncrypt
           ? this.encryption.encryptByAES(stringData)
@@ -79,7 +84,9 @@ export const createStorage = ({
       if (!val) return def;
 
       try {
-        const decVal = this.hasEncrypt ? this.encryption.decryptByAES(val) : val;
+        const decVal = this.hasEncrypt
+          ? this.encryption.decryptByAES(val)
+          : val;
         const data = JSON.parse(decVal);
         const { value, expire } = data;
         if (isNullOrUnDef(expire) || expire < new Date().getTime()) {

src/utils/cipher.ts

@@ -1,9 +1,9 @@
 import { encrypt, decrypt } from 'crypto-js/aes';
-import { parse } from 'crypto-js/enc-utf8';
+import UTF8, { parse } from 'crypto-js/enc-utf8';
 import pkcs7 from 'crypto-js/pad-pkcs7';
 import ECB from 'crypto-js/mode-ecb';
 import md5 from 'crypto-js/md5';
-import UTF8 from 'crypto-js/enc-utf8';
+
 import Base64 from 'crypto-js/enc-base64';
 
 export interface EncryptionParams {
@@ -16,6 +16,7 @@ export interface EncryptionParams {
  */
 export class AesEncryption {
   private key;
+
   private iv;
 
   constructor(opt: Partial<EncryptionParams> = {}) {

src/utils/fonts.ts

@@ -50,7 +50,9 @@ const fontFamilyList = [
   },
 ];
 
-function LoadFontFace(data: UniApp.LoadFontFaceOptions & { weight?: string; global?: boolean }) {
+function LoadFontFace(
+  data: UniApp.LoadFontFaceOptions & { weight?: string; global?: boolean },
+) {
   return new Promise((resolve, reject) => {
     uni.loadFontFace({
       global: true,
@@ -60,10 +62,10 @@ function LoadFontFace(data: UniApp.LoadFontFaceOptions & { weight?: string; glob
         weight: data.weight ?? 'normal',
         variant: 'normal',
       },
-      success: (res) => {
+      success: res => {
         resolve(res);
       },
-      fail: (err) => {
+      fail: err => {
         reject(err);
       },
     });
@@ -76,9 +78,9 @@ function LoadFontFace(data: UniApp.LoadFontFaceOptions & { weight?: string; glob
 export function dynamicLoadFontFace() {
   /* 实际项目中替换为自己服务器的静态资源地址
    * 微信小程序端字体链接必须是同源下的，或开启了cors支持，微信小程序的域名是servicewechat.com
-   **/
+   * */
   const DYNAMIC_LOAD_FONT_FACE_URL = `${BASE_URL}/fonts`;
-  fontFamilyList.forEach((fontFamily) => {
+  fontFamilyList.forEach(fontFamily => {
     LoadFontFace({
       ...fontFamily,
       source: `url(${DYNAMIC_LOAD_FONT_FACE_URL}${fontFamily.source})`,
@@ -86,7 +88,7 @@ export function dynamicLoadFontFace() {
       .then((res: any) => {
         console.log(fontFamily.family, res.errMsg);
       })
-      .catch((err) => {
+      .catch(err => {
         console.error(fontFamily.family, err.errMsg);
       });
   });
@@ -96,9 +98,9 @@ export function dynamicLoadFontFace() {
  * APP本地加载字体
  */
 export function loadFontFaceFromLocal() {
-  fontFamilyList.forEach((fontFamily) => {
+  fontFamilyList.forEach(fontFamily => {
     const source = `url(${plus.io.convertLocalFileSystemURL(
-      '_www/static/fonts' + fontFamily.source,
+      `_www/static/fonts${fontFamily.source}`,
     )})`;
     LoadFontFace({
       ...fontFamily,
@@ -107,7 +109,7 @@ export function loadFontFaceFromLocal() {
       .then((res: any) => {
         console.log(fontFamily.family, res.errMsg);
       })
-      .catch((err) => {
+      .catch(err => {
         console.error(fontFamily.family, err);
       });
   });

src/utils/http/index.ts

@@ -26,7 +26,7 @@ const request = createRequest();
  * 请求拦截器
  */
 request.interceptors.request.use(
-  (options) => {
+  options => {
     if (options.custom?.auth) {
       const authStore = useAuthStore();
       if (!authStore.isLogin) {
@@ -40,16 +40,14 @@ request.interceptors.request.use(
     }
     return options;
   },
-  (options) => {
+  options => Promise.reject(options),
-    return Promise.reject(options);
-  },
 );
 
 /**
  * 响应拦截器
  */
 request.interceptors.response.use(
-  async (response) => {
+  async response => {
     const { data: resData } = response;
     const { code, message } = resData;
     if (code === ResultEnum.SUCCESS) {
@@ -58,11 +56,10 @@ request.interceptors.response.use(
     Toast(message);
     return Promise.reject(resData);
   },
-  (response) => {
+  response =>
     // 请求错误做点什么。可以使用async await 做异步操作
     // error('Request Error!');
-    return Promise.reject(response);
+    Promise.reject(response),
-  },
 );
 
 export { request };

src/utils/index.ts

@@ -8,7 +8,9 @@ import { isObject } from '@/utils/is';
 export function deepMerge<T = any>(src: any = {}, target: any = {}): T {
   let key: string;
   for (key in target) {
-    src[key] = isObject(src[key]) ? deepMerge(src[key], target[key]) : (src[key] = target[key]);
+    src[key] = isObject(src[key])
+      ? deepMerge(src[key], target[key])
+      : (src[key] = target[key]);
   }
   return src;
 }

src/utils/interceptors/index.ts

@@ -1,4 +1,7 @@
-import { routerInterceptor, routerRemoveInterceptor } from '@/utils/router/interceptor';
+import {
+  routerInterceptor,
+  routerRemoveInterceptor,
+} from '@/utils/router/interceptor';
 
 export function setupInterceptors() {
   routerInterceptor();

src/utils/is.ts

@@ -1,4 +1,4 @@
-const toString = Object.prototype.toString;
+const { toString } = Object.prototype;
 
 export function is(val: unknown, type: string) {
   return toString.call(val) === `[object ${type}]`;
@@ -53,7 +53,12 @@ export function isNumber(val: unknown): val is number {
 }
 
 export function isPromise<T = any>(val: unknown): val is Promise<T> {
-  return is(val, 'Promise') && isObject(val) && isFunction(val.then) && isFunction(val.catch);
+  return (
+    is(val, 'Promise') &&
+    isObject(val) &&
+    isFunction(val.then) &&
+    isFunction(val.catch)
+  );
 }
 
 export function isString(val: unknown): val is string {

src/utils/router/interceptor.ts

@@ -1,4 +1,8 @@
-import { HOME_PAGE, NAVIGATE_TYPE_LIST, NOT_FOUND_PAGE } from '@/enums/routerEnum';
+import {
+  HOME_PAGE,
+  NAVIGATE_TYPE_LIST,
+  NOT_FOUND_PAGE,
+} from '@/enums/routerEnum';
 import { useAuthStore } from '@/state/modules/auth';
 import { isIgnoreAuth, jumpLogin } from '@/utils/router/constant';
 
@@ -28,7 +32,7 @@ export function routerBeforeEach(path: string): boolean {
 function addInterceptor(routerName: string) {
   uni.addInterceptor(routerName, {
     // 跳转前拦截
-    invoke: (args) => {
+    invoke: args => {
       const flag = routerBeforeEach(args.url);
       return flag ? args : false;
     },
@@ -60,7 +64,7 @@ function addInterceptor(routerName: string) {
  * 添加路由拦截器
  */
 export function routerInterceptor() {
-  NAVIGATE_TYPE_LIST.forEach((item) => {
+  NAVIGATE_TYPE_LIST.forEach(item => {
     addInterceptor(item);
   });
 }
@@ -69,7 +73,7 @@ export function routerInterceptor() {
  * 移除路由拦截器
  */
 export function routerRemoveInterceptor() {
-  NAVIGATE_TYPE_LIST.forEach((item) => {
+  NAVIGATE_TYPE_LIST.forEach(item => {
     uni.removeInterceptor(item);
   });
 }

src/utils/router/navigates.ts

@@ -1,20 +1,25 @@
-import { NAVIGATE_TYPE } from '@/enums/routerEnum';
 import { warn } from 'vue';
+import { cloneDeep } from 'lodash-es';
+import { NAVIGATE_TYPE } from '@/enums/routerEnum';
 import { deepMerge } from '@/utils';
 import { routerBeforeEach } from '@/utils/router/interceptor';
-import { cloneDeep } from 'lodash-es';
 import { useRouterStore } from '@/state/modules/router';
 import { filterPath } from '@/utils/router/constant';
 
-export type NavigateOptions = Partial<Omit<UniApp.NavigateToOptions, 'url'>> & { delta?: number };
+export type NavigateOptions = Partial<Omit<UniApp.NavigateToOptions, 'url'>> & {
+  delta?: number;
+};
 
 export class Navigates {
   private type: string;
+
   private readonly options: NavigateOptions;
+
   constructor(type?: string, options?: NavigateOptions) {
     this.type = type || NAVIGATE_TYPE.NAVIGATE_TO;
     this.options = options || {};
   }
+
   navigate(url: string, options?: NavigateOptions) {
     const navigateOptions = deepMerge(cloneDeep(this.options), options);
     const _options = deepMerge({ url }, navigateOptions);

src/utils/router/routes.ts

@@ -1,21 +1,21 @@
+import { assign } from 'lodash-es';
 import pagesJson from '@/pages.json';
 import { Route } from '@/types/router/route';
-import { assign } from 'lodash-es';
 
 const { pages, subPackages, tabBar } = pagesJson;
 
 // 将pages.json转换成Map对象,path为key
 const pagesMap = new Map<string, Route>();
 
-pages.forEach((page) => {
+pages.forEach(page => {
   pagesMap.set(page.path, page as Route);
 });
 
 if (Array.isArray(subPackages) && subPackages.length) {
-  subPackages.forEach((el) => {
+  subPackages.forEach(el => {
     const rootPath = el.root;
-    el.pages.forEach((page) => {
+    el.pages.forEach(page => {
-      page.path = rootPath + '/' + page.path;
+      page.path = `${rootPath}/${page.path}`;
       pagesMap.set(page.path, page as Route);
     });
   });
@@ -24,7 +24,7 @@ if (Array.isArray(subPackages) && subPackages.length) {
 if (tabBar) {
   const tabBarList = tabBar.list;
   if (Array.isArray(tabBarList)) {
-    tabBarList.forEach((el) => {
+    tabBarList.forEach(el => {
       if (pagesMap.has(el.pagePath)) {
         const page = pagesMap.get(el.pagePath);
         const meta = page?.meta || {};

src/utils/uniapi/index.ts

@@ -4,34 +4,32 @@
  * @param showToast 配置是否弹出提示，默认弹出提示
  * @constructor
  */
-export const SetClipboardData = (data: string, showToast = true) => {
+export const SetClipboardData = (data: string, showToast = true) =>
-  return new Promise((resolve, reject) => {
+  new Promise((resolve, reject) => {
     uni.setClipboardData({
-      data: data,
+      data,
-      showToast: showToast,
+      showToast,
-      success: (res) => {
+      success: res => {
         resolve(res);
       },
-      fail: (err) => {
+      fail: err => {
         reject(err);
       },
     });
   });
-};
 
 /**
  * @description 获取系统剪贴板内容
  * @constructor
  */
-export const GetClipboardData = () => {
+export const GetClipboardData = () =>
-  return new Promise((resolve, reject) => {
+  new Promise((resolve, reject) => {
     uni.getClipboardData({
-      success: (res) => {
+      success: res => {
         resolve(res);
       },
-      fail: (err) => {
+      fail: err => {
         reject(err);
       },
     });
   });
-};

src/utils/uniapi/prompt.ts

@@ -9,9 +9,12 @@
  * @param options
  * @constructor
  */
-export function Toast(title: string, options?: Partial<UniApp.ShowToastOptions>) {
+export function Toast(
+  title: string,
+  options?: Partial<UniApp.ShowToastOptions>,
+) {
   uni.showToast({
-    title: title,
+    title,
     duration: 1500,
     icon: 'none',
     mask: true,
@@ -32,9 +35,12 @@ export function HideToast() {
  * @param options
  * @constructor
  */
-export function Loading(title: string, options?: Partial<UniApp.ShowLoadingOptions>) {
+export function Loading(
+  title: string,
+  options?: Partial<UniApp.ShowLoadingOptions>,
+) {
   uni.showLoading({
-    title: title,
+    title,
     mask: true,
     ...options,
   });
@@ -56,10 +62,10 @@ export function Modal(options: UniApp.ShowModalOptions) {
   return new Promise((resolve, reject) => {
     uni.showModal({
       ...options,
-      success: (res) => {
+      success: res => {
         resolve(res);
       },
-      fail: (res) => {
+      fail: res => {
         reject(res);
       },
     });
@@ -75,10 +81,10 @@ export function ActionSheet(options: UniApp.ShowActionSheetOptions) {
   return new Promise((resolve, reject) => {
     uni.showActionSheet({
       ...options,
-      success: (res) => {
+      success: res => {
         resolve(res);
       },
-      fail: (res) => {
+      fail: res => {
         reject(res);
       },
     });