diff --git a/src/packages/__VUE/cell/index.taro.vue b/src/packages/__VUE/cell/index.taro.vue
index 6f2fde02b0..b395725c1b 100644
--- a/src/packages/__VUE/cell/index.taro.vue
+++ b/src/packages/__VUE/cell/index.taro.vue
@@ -1,11 +1,46 @@
-<template src="./template.html"></template>
+<template>
+  <view :class="classes" :style="baseStyle" @click="handleClick">
+    <slot>
+      <view v-if="$slots.icon" class="nut-cell__icon">
+        <slot name="icon"></slot>
+      </view>
+      <view v-if="title || subTitle || $slots.title" class="nut-cell__title">
+        <template v-if="subTitle">
+          <slot name="title">
+            <view class="title">{{ title }}</view>
+          </slot>
+          <view class="nut-cell__title-desc">{{ subTitle }}</view>
+        </template>
+        <template v-else>
+          <slot name="title">
+            {{ title }}
+          </slot>
+        </template>
+      </view>
+      <view
+        v-if="desc || $slots.desc"
+        class="nut-cell__value"
+        :class="{ 'nut-cell__value--alone': !title && !subTitle && !$slots.title }"
+        :style="descStyle"
+      >
+        <slot name="desc">
+          {{ desc }}
+        </slot>
+      </view>
+      <slot name="link">
+        <Right v-if="isLink || to" class="nut-cell__link"></Right>
+      </slot>
+    </slot>
+  </view>
+</template>
 
 <script lang="ts">
+import type { CSSProperties } from 'vue';
 import { computed } from 'vue';
 import { createComponent } from '@/packages/utils/create';
 import { pxCheck } from '@/packages/utils/pxCheck';
-const { componentName, create } = createComponent('cell');
 import { Right } from '@nutui/icons-vue-taro';
+const { componentName, create } = createComponent('cell');
 export default create({
   components: { Right },
   props: {
@@ -39,6 +74,12 @@ export default create({
       };
     });
 
+    const descStyle = computed(() => {
+      return {
+        textAlign: props.descTextAlign
+      } as CSSProperties;
+    });
+
     const handleClick = (event: Event) => {
       emit('click', event);
     };
@@ -46,7 +87,8 @@ export default create({
     return {
       handleClick,
       classes,
-      baseStyle
+      baseStyle,
+      descStyle
     };
   }
 });
diff --git a/src/packages/__VUE/cell/index.vue b/src/packages/__VUE/cell/index.vue
index bcf8a207cf..c2ce50c569 100644
--- a/src/packages/__VUE/cell/index.vue
+++ b/src/packages/__VUE/cell/index.vue
@@ -1,6 +1,41 @@
-<template src="./template.html"></template>
+<template>
+  <view :class="classes" :style="baseStyle" @click="handleClick">
+    <slot>
+      <view v-if="$slots.icon" class="nut-cell__icon">
+        <slot name="icon"></slot>
+      </view>
+      <view v-if="title || subTitle || $slots.title" class="nut-cell__title">
+        <template v-if="subTitle">
+          <slot name="title">
+            <view class="title">{{ title }}</view>
+          </slot>
+          <view class="nut-cell__title-desc">{{ subTitle }}</view>
+        </template>
+        <template v-else>
+          <slot name="title">
+            {{ title }}
+          </slot>
+        </template>
+      </view>
+      <view
+        v-if="desc || $slots.desc"
+        class="nut-cell__value"
+        :class="{ 'nut-cell__value--alone': !title && !subTitle && !$slots.title }"
+        :style="descStyle"
+      >
+        <slot name="desc">
+          {{ desc }}
+        </slot>
+      </view>
+      <slot name="link">
+        <Right v-if="isLink || to" class="nut-cell__link"></Right>
+      </slot>
+    </slot>
+  </view>
+</template>
 
 <script lang="ts">
+import type { CSSProperties } from 'vue';
 import { computed } from 'vue';
 import { createComponent } from '@/packages/utils/create';
 import { useRouter } from '@/packages/utils/useRoute';
@@ -41,6 +76,12 @@ export default create({
       };
     });
 
+    const descStyle = computed(() => {
+      return {
+        textAlign: props.descTextAlign
+      } as CSSProperties;
+    });
+
     const handleClick = (event: Event) => {
       emit('click', event);
 
@@ -54,7 +95,8 @@ export default create({
     return {
       handleClick,
       classes,
-      baseStyle
+      baseStyle,
+      descStyle
     };
   }
 });
diff --git a/src/packages/__VUE/cell/template.html b/src/packages/__VUE/cell/template.html
deleted file mode 100644
index c15f25e477..0000000000
--- a/src/packages/__VUE/cell/template.html
+++ /dev/null
@@ -1,31 +0,0 @@
-<view :class="classes" :style="baseStyle" @click="handleClick">
-    <slot>
-        <view class="nut-cell__icon" v-if="$slots.icon">
-            <slot name="icon"></slot>
-        </view>
-        <view class="nut-cell__title" v-if="title || subTitle || $slots.title">
-
-            <template v-if="subTitle">
-                <slot name="title">
-                    <view class="title">{{ title }}</view>
-                </slot>
-                <view class="nut-cell__title-desc">{{ subTitle }}</view>
-            </template>
-            <template v-else>
-                <slot name="title">
-                    {{ title }}
-                </slot>
-            </template>
-        </view>
-        <view v-if="desc || $slots.desc" class="nut-cell__value"
-            :class="{ 'nut-cell__value--alone': (!title && !subTitle && !$slots.title) }"
-            :style="{ 'text-align': descTextAlign }">
-            <slot name="desc">
-                {{ desc }}
-            </slot>        
-        </view>
-        <slot name="link">
-            <Right v-if="isLink || to" class="nut-cell__link"></Right>
-        </slot>
-    </slot>
-</view>
diff --git a/src/packages/__VUE/fixednav/index.taro.vue b/src/packages/__VUE/fixednav/index.taro.vue
index 3e6db347eb..7de076caa9 100644
--- a/src/packages/__VUE/fixednav/index.taro.vue
+++ b/src/packages/__VUE/fixednav/index.taro.vue
@@ -1,4 +1,31 @@
-<template src="./template.html"></template>
+<template>
+  <view :class="classes" :style="position">
+    <nut-overlay v-if="overlay" :visible="visible" :z-index="200" @click="updateValue(false)" />
+    <slot name="list">
+      <view class="nut-fixed-nav__list">
+        <view
+          v-for="(item, index) in navList"
+          :key="item.id || index"
+          class="nut-fixed-nav__list-item"
+          :class="{ active: item.id == current }"
+          @click="selected(item, $event)"
+        >
+          <img :src="item.icon" />
+          <view class="span">{{ item.text }}</view>
+          <view v-if="item.num" class="b">{{ item.num }}</view>
+        </view>
+      </view>
+    </slot>
+    <div class="nut-fixed-nav__btn" @click="updateValue()">
+      <slot name="btn">
+        <Left color="#fff" />
+        <view class="text">
+          {{ visible ? activeText || translate('activeText') : unActiveText || translate('unActiveText') }}
+        </view>
+      </slot>
+    </div>
+  </view>
+</template>
 <script lang="ts">
 import { PropType, computed, ref } from 'vue';
 import { Left } from '@nutui/icons-vue-taro';
diff --git a/src/packages/__VUE/fixednav/index.vue b/src/packages/__VUE/fixednav/index.vue
index e8299c58cb..0c2212b86d 100644
--- a/src/packages/__VUE/fixednav/index.vue
+++ b/src/packages/__VUE/fixednav/index.vue
@@ -1,4 +1,31 @@
-<template src="./template.html"></template>
+<template>
+  <view :class="classes" :style="position">
+    <nut-overlay v-if="overlay" :visible="visible" :z-index="200" @click="updateValue(false)" />
+    <slot name="list">
+      <view class="nut-fixed-nav__list">
+        <view
+          v-for="(item, index) in navList"
+          :key="item.id || index"
+          class="nut-fixed-nav__list-item"
+          :class="{ active: item.id == current }"
+          @click="selected(item, $event)"
+        >
+          <img :src="item.icon" />
+          <view class="span">{{ item.text }}</view>
+          <view v-if="item.num" class="b">{{ item.num }}</view>
+        </view>
+      </view>
+    </slot>
+    <div class="nut-fixed-nav__btn" @click="updateValue()">
+      <slot name="btn">
+        <Left color="#fff" />
+        <view class="text">
+          {{ visible ? activeText || translate('activeText') : unActiveText || translate('unActiveText') }}
+        </view>
+      </slot>
+    </div>
+  </view>
+</template>
 <script lang="ts">
 import { PropType, computed, ref } from 'vue';
 import { Left } from '@nutui/icons-vue';
diff --git a/src/packages/__VUE/fixednav/template.html b/src/packages/__VUE/fixednav/template.html
deleted file mode 100644
index 182a6d2813..0000000000
--- a/src/packages/__VUE/fixednav/template.html
+++ /dev/null
@@ -1,21 +0,0 @@
-<view :class="classes" :style="position">
-    <nut-overlay v-if="overlay" :visible="visible" :z-index="200" @click="updateValue(false)" />
-    <slot name="list">
-        <view class="nut-fixed-nav__list">
-            <view class="nut-fixed-nav__list-item" :class="{ active: item.id == current }"
-                v-for="(item, index) in navList" @click="selected(item, $event)" :key="item.id || index">
-                <img :src="item.icon" />
-                <view class="span">{{ item.text }}</view>
-                <view class="b" v-if="item.num">{{ item.num }}</view>
-            </view>
-        </view>
-    </slot>
-    <div class="nut-fixed-nav__btn" @click="updateValue()">
-        <slot name="btn">
-            <Left color="#fff" />
-            <view class="text">{{ visible ? activeText || translate('activeText') : unActiveText ||
-                translate('unActiveText') }}
-            </view>
-        </slot>
-    </div>
-</view>
\ No newline at end of file
diff --git a/src/packages/__VUE/rate/index.taro.vue b/src/packages/__VUE/rate/index.taro.vue
index 470f3bab18..e84fdd0706 100644
--- a/src/packages/__VUE/rate/index.taro.vue
+++ b/src/packages/__VUE/rate/index.taro.vue
@@ -1,4 +1,52 @@
-<template src="./template.html"></template>
+<template>
+  <view class="nut-rate">
+    <view
+      v-for="n in Number(count)"
+      :id="'rateRefs-' + refRandomId + n"
+      :key="n"
+      ref="rateRefs"
+      class="nut-rate-item"
+      :style="n < Number(count) ? { marginRight: pxCheck(spacing) } : {}"
+    >
+      <view class="nut-rate-item__icon--full">
+        <component
+          :is="
+            renderIcon(customIcon, {
+              width: size,
+              height: size,
+              size,
+              color: n <= Number(modelValue) ? activeColor : voidColor
+            })
+          "
+          class="nut-rate-item__icon"
+          :class="{ 'nut-rate-item__icon--disabled': disabled || n > Number(modelValue) }"
+          @click="onClick(1, n)"
+        ></component>
+      </view>
+      <view v-if="allowHalf && Number(modelValue) + 1 > n" class="nut-rate-item__icon--half">
+        <component
+          :is="
+            renderIcon(customIcon, {
+              width: size,
+              height: size,
+              size,
+              color: n <= Number(modelValue) + 1 ? activeColor : voidColor
+            })
+          "
+          class="nut-rate-item__icon"
+          @click="onClick(2, n)"
+        ></component>
+      </view>
+      <view v-else-if="allowHalf && Number(modelValue) + 1 < n" class="nut-rate-item__icon--half">
+        <component
+          :is="renderIcon(customIcon, { width: size, height: size, size, color: voidColor })"
+          class="nut-rate-item__icon nut-rate-item__icon--disabled"
+          @click="onClick(2, n)"
+        ></component>
+      </view>
+    </view>
+  </view>
+</template>
 <script lang="ts">
 import { ref } from 'vue';
 import { StarFillN } from '@nutui/icons-vue-taro';
diff --git a/src/packages/__VUE/rate/index.vue b/src/packages/__VUE/rate/index.vue
index f57a1b5646..f1592416ee 100644
--- a/src/packages/__VUE/rate/index.vue
+++ b/src/packages/__VUE/rate/index.vue
@@ -1,4 +1,52 @@
-<template src="./template.html"></template>
+<template>
+  <view class="nut-rate" @touchstart="onTouchStart" @touchmove="onTouchMove">
+    <view
+      v-for="n in Number(count)"
+      :id="'rateRefs-' + refRandomId + n"
+      :key="n"
+      ref="rateRefs"
+      class="nut-rate-item"
+      :style="n < Number(count) ? { marginRight: pxCheck(spacing) } : {}"
+    >
+      <view class="nut-rate-item__icon--full">
+        <component
+          :is="
+            renderIcon(customIcon, {
+              width: size,
+              height: size,
+              size,
+              color: n <= Number(modelValue) ? activeColor : voidColor
+            })
+          "
+          class="nut-rate-item__icon"
+          :class="{ 'nut-rate-item__icon--disabled': disabled || n > Number(modelValue) }"
+          @click="onClick(1, n)"
+        ></component>
+      </view>
+      <view v-if="allowHalf && Number(modelValue) + 1 > n" class="nut-rate-item__icon--half">
+        <component
+          :is="
+            renderIcon(customIcon, {
+              width: size,
+              height: size,
+              size,
+              color: n <= Number(modelValue) + 1 ? activeColor : voidColor
+            })
+          "
+          class="nut-rate-item__icon"
+          @click="onClick(2, n)"
+        ></component>
+      </view>
+      <view v-else-if="allowHalf && Number(modelValue) + 1 < n" class="nut-rate-item__icon--half">
+        <component
+          :is="renderIcon(customIcon, { width: size, height: size, size, color: voidColor })"
+          class="nut-rate-item__icon nut-rate-item__icon--disabled"
+          @click="onClick(2, n)"
+        ></component>
+      </view>
+    </view>
+  </view>
+</template>
 <script lang="ts">
 import { Ref, ref } from 'vue';
 import { StarFillN } from '@nutui/icons-vue';
diff --git a/src/packages/__VUE/rate/template.html b/src/packages/__VUE/rate/template.html
deleted file mode 100644
index 0dcc954759..0000000000
--- a/src/packages/__VUE/rate/template.html
+++ /dev/null
@@ -1,20 +0,0 @@
-<view class="nut-rate" @touchstart="onTouchStart" @touchmove="onTouchMove">
-  <view class="nut-rate-item" v-for="n in Number(count)" :key="n" ref="rateRefs" :id="'rateRefs-' + refRandomId + n"
-    :style="n < Number(count) ? { marginRight: pxCheck(spacing) } : {}">
-    <view class="nut-rate-item__icon--full">
-      <component
-        :is="renderIcon(customIcon,{width:size,height:size,size,color:n <= modelValue ? activeColor : voidColor})"
-        class="nut-rate-item__icon" :class="{ 'nut-rate-item__icon--disabled': disabled || n > modelValue }"
-        @click="onClick(1, n)"></component>
-    </view>
-    <view class="nut-rate-item__icon--half" v-if="allowHalf && Number(modelValue) + 1 > n">
-      <component
-        :is="renderIcon(customIcon,{width:size,height:size,size,color:n <= Number(modelValue) + 1 ? activeColor : voidColor})"
-        class="nut-rate-item__icon" @click="onClick(2, n)"></component>
-    </view>
-    <view class="nut-rate-item__icon--half" v-else-if="allowHalf && Number(modelValue) + 1 < n">
-      <component :is="renderIcon(customIcon,{width:size,height:size,size,color:voidColor})"
-        class="nut-rate-item__icon nut-rate-item__icon--disabled" @click="onClick(2, n)"></component>
-    </view>
-  </view>
-</view>
\ No newline at end of file
diff --git a/src/packages/utils/pxCheck.ts b/src/packages/utils/pxCheck.ts
index a2d73f2b74..5ce85ea6b4 100644
--- a/src/packages/utils/pxCheck.ts
+++ b/src/packages/utils/pxCheck.ts
@@ -1,3 +1,5 @@
-export const pxCheck = (value: string | number): string => {
-  return isNaN(Number(value)) ? String(value) : `${value}px`;
+export const pxCheck = (value?: string | number): string | undefined => {
+  if (value !== undefined) {
+    return isNaN(Number(value)) ? String(value) : `${value}px`;
+  }
 };