refactor: demo 放到一个固定文件夹

pages.config.ts

@@ -16,9 +16,9 @@ export default defineUniPages({
     },
   },
   tabBar: {
-    color: '#7A7E83',
-    selectedColor: '#00f',
-    backgroundColor: '#ffffff',
+    color: '#999999',
+    selectedColor: '#018d71',
+    backgroundColor: '#F8F8F8',
     borderStyle: 'black',
     height: '50px',
     fontSize: '10px',
@@ -26,16 +26,22 @@ export default defineUniPages({
     spacing: '3px',
     list: [
       {
+        iconPath: 'static/tabbar/home.png',
+        selectedIconPath: 'static/tabbar/homeHL.png',
         pagePath: 'pages/index/index',
-        iconPath: 'static/tab-icons/extui.png',
-        selectedIconPath: 'static/tab-icons/extuiHL.png',
         text: '首页',
       },
       {
-        pagePath: 'pages/throughout/index',
-        iconPath: 'static/tab-icons/template.png',
-        selectedIconPath: 'static/tab-icons/templateHL.png',
-        text: '通屏',
+        iconPath: 'static/tabbar/example.png',
+        selectedIconPath: 'static/tabbar/exampleHL.png',
+        pagePath: 'pages/demo/index',
+        text: '示例',
+      },
+      {
+        iconPath: 'static/tabbar/personal.png',
+        selectedIconPath: 'static/tabbar/personalHL.png',
+        pagePath: 'pages/my/index',
+        text: '我的',
       },
     ],
   },

src/pages.json

@@ -14,9 +14,9 @@
     }
   },
   "tabBar": {
-    "color": "#7A7E83",
-    "selectedColor": "#00f",
-    "backgroundColor": "#ffffff",
+    "color": "#999999",
+    "selectedColor": "#018d71",
+    "backgroundColor": "#F8F8F8",
     "borderStyle": "black",
     "height": "50px",
     "fontSize": "10px",
@@ -24,16 +24,22 @@
     "spacing": "3px",
     "list": [
       {
+        "iconPath": "static/tabbar/home.png",
+        "selectedIconPath": "static/tabbar/homeHL.png",
         "pagePath": "pages/index/index",
-        "iconPath": "static/tab-icons/extui.png",
-        "selectedIconPath": "static/tab-icons/extuiHL.png",
         "text": "首页"
       },
       {
-        "pagePath": "pages/throughout/index",
-        "iconPath": "static/tab-icons/template.png",
-        "selectedIconPath": "static/tab-icons/templateHL.png",
-        "text": "通屏"
+        "iconPath": "static/tabbar/example.png",
+        "selectedIconPath": "static/tabbar/exampleHL.png",
+        "pagePath": "pages/demo/index",
+        "text": "示例"
+      },
+      {
+        "iconPath": "static/tabbar/personal.png",
+        "selectedIconPath": "static/tabbar/personalHL.png",
+        "pagePath": "pages/my/index",
+        "text": "我的"
       }
     ]
   },
@@ -46,25 +52,8 @@
       }
     },
     {
-      "path": "pages/demo/clock",
-      "type": "page",
-      "style": {
-        "navigationBarTitleText": "动态时钟"
-      }
-    },
-    {
-      "path": "pages/demo/lottery",
-      "type": "page",
-      "style": {
-        "navigationBarTitleText": "九宫格抽奖"
-      }
-    },
-    {
-      "path": "pages/demo/lottery2",
-      "type": "page",
-      "style": {
-        "navigationBarTitleText": "大转盘抽奖"
-      }
+      "path": "pages/demo/index",
+      "type": "page"
     },
     {
       "path": "pages/login/login",
@@ -74,63 +63,49 @@
       }
     },
     {
-      "path": "pages/lottery/big-wheel",
+      "path": "pages/my/index",
       "type": "page",
       "style": {
-        "navigationBarTitleText": "大转盘抽奖"
+        "navigationBarTitleText": "我的"
       }
     },
     {
-      "path": "pages/lottery/nine-grid",
+      "path": "pages/demo/demo/clock",
       "type": "page",
       "style": {
-        "navigationBarTitleText": "九宫格抽奖"
+        "navigationBarTitleText": "动态时钟"
       }
     },
     {
-      "path": "pages/my/index",
+      "path": "pages/demo/demo/component-auto-import",
       "type": "page",
       "style": {
-        "navigationBarTitleText": "我的"
+        "navigationBarTitleText": "easycom 自动导入"
       }
     },
     {
-      "path": "pages/throughout/index",
+      "path": "pages/demo/demo/lottery",
       "type": "page",
       "style": {
-        "navigationBarTitleText": "通屏+下拉刷新+自定义导航栏",
-        "enablePullDownRefresh": true,
-        "backgroundColor": "#23c09c",
-        "app-plus": {
-          "titleNView": {
-            "type": "transparent"
-          }
-        },
-        "mp-weixin": {
-          "navigationStyle": "custom"
-        }
+        "navigationBarTitleText": "九宫格抽奖"
       }
     },
     {
-      "path": "pages/demo/img-min/index",
-      "type": "page"
-    },
-    {
-      "path": "pages/index/demo/component-auto-import",
+      "path": "pages/demo/demo/lottery2",
       "type": "page",
       "style": {
-        "navigationBarTitleText": "easycom 自动导入"
+        "navigationBarTitleText": "大转盘抽奖"
       }
     },
     {
-      "path": "pages/index/demo/mp-weixin-share",
+      "path": "pages/demo/demo/mp-weixin-share",
       "type": "page",
       "style": {
         "navigationBarTitleText": "微信分享"
       }
     },
     {
-      "path": "pages/index/demo/navbar",
+      "path": "pages/demo/demo/navbar",
       "type": "page",
       "style": {
         "navigationBarTitleText": "自定义导航栏",
@@ -138,14 +113,14 @@
       }
     },
     {
-      "path": "pages/index/demo/pages-auto-import",
+      "path": "pages/demo/demo/pages-auto-import",
       "type": "page",
       "style": {
         "navigationBarTitleText": "pages 自动导入"
       }
     },
     {
-      "path": "pages/index/demo/pinia",
+      "path": "pages/demo/demo/pinia",
       "type": "page",
       "layout": "display",
       "style": {
@@ -153,14 +128,14 @@
       }
     },
     {
-      "path": "pages/index/demo/request",
+      "path": "pages/demo/demo/request",
       "type": "page",
       "style": {
         "navigationBarTitleText": "request请求+请求拦截"
       }
     },
     {
-      "path": "pages/index/demo/throughout",
+      "path": "pages/demo/demo/throughout",
       "type": "page",
       "style": {
         "navigationBarTitleText": "通屏+下拉刷新+自定义导航栏",
@@ -177,32 +152,67 @@
       }
     },
     {
-      "path": "pages/index/demo/uni-ui-icons",
+      "path": "pages/demo/demo/uni-ui-icons",
       "type": "page",
       "style": {
         "navigationBarTitleText": "UniUI Icons 使用"
       }
     },
     {
-      "path": "pages/index/demo/uni-ui",
+      "path": "pages/demo/demo/uni-ui",
       "type": "page",
       "style": {
         "navigationBarTitleText": "UniUI 使用"
       }
     },
     {
-      "path": "pages/index/demo/unocss-icons",
+      "path": "pages/demo/demo/unocss-icons",
       "type": "page",
       "style": {
         "navigationBarTitleText": "UnoCss Icons 使用"
       }
     },
     {
-      "path": "pages/index/demo/unocss",
+      "path": "pages/demo/demo/unocss",
       "type": "page",
       "style": {
         "navigationBarTitleText": "UnoCss 使用"
       }
+    },
+    {
+      "path": "pages/demo/demo/img-min/index",
+      "type": "page"
+    },
+    {
+      "path": "pages/demo/demo/lottery/big-wheel",
+      "type": "page",
+      "style": {
+        "navigationBarTitleText": "大转盘抽奖"
+      }
+    },
+    {
+      "path": "pages/demo/demo/lottery/nine-grid",
+      "type": "page",
+      "style": {
+        "navigationBarTitleText": "九宫格抽奖"
+      }
+    },
+    {
+      "path": "pages/demo/demo/throughout/index",
+      "type": "page",
+      "style": {
+        "navigationBarTitleText": "通屏+下拉刷新+自定义导航栏",
+        "enablePullDownRefresh": true,
+        "backgroundColor": "#23c09c",
+        "app-plus": {
+          "titleNView": {
+            "type": "transparent"
+          }
+        },
+        "mp-weixin": {
+          "navigationStyle": "custom"
+        }
+      }
     }
   ],
   "subPackages": []

src/pages/demo/index.vue

@@ -0,0 +1,116 @@
+<template>
+  <view class="bg-slate-100">
+    <view class="bg-slate-100 w-full">
+      <view v-for="item in list" :key="item.url" class="mt-3">
+        <view
+          class="flex bg-white items-center justify-between p-3 mb-2"
+          @click="goDetailPage(item.url)"
+        >
+          <text class="flex-1 text-4 text-dark">{{ item.name }}</text>
+          <text class="i-carbon-chevron-right"></text>
+        </view>
+      </view>
+    </view>
+    <view class="m-4">
+      <text>测试配置exclude后，还会自动导入页面吗？</text>
+      <PagesAutoImport />
+    </view>
+  </view>
+</template>
+
+<script setup lang="ts" name="TestIndex">
+import { ref } from 'vue'
+import { onShareAppMessage, onShareTimeline } from '@dcloudio/uni-app'
+import PagesAutoImport from './components/pages-auto-import.vue'
+/** 激活“分享给好友” */
+onShareAppMessage((options: Page.ShareAppMessageOption): Page.CustomShareContent => {
+  console.log('options:', options)
+  return {
+    title: '自定义分享标题',
+    path: '/pages/index/index?id=xxx',
+    imageUrl:
+      'https://cip-shopping-page-0eysug01066a9e-1302818703.tcloudbaseapp.com/pretty-girl.png',
+  }
+})
+/** 激活“分享到朋友圈”， 注意：需要先激活“分享给好友” */
+onShareTimeline((): Page.ShareTimelineContent => {
+  return {
+    title: '自定义分享标题',
+    query: 'a=1&b=2',
+  }
+})
+
+const list = ref([
+  {
+    name: 'UnoCSS',
+    url: 'unocss',
+  },
+  {
+    name: 'UnoCSS Icons',
+    url: 'unocss-icons',
+  },
+  {
+    name: 'UniUI',
+    url: 'uni-ui',
+  },
+  {
+    name: 'UniUI Icons',
+    url: 'uni-ui-icons',
+  },
+  {
+    name: 'Pinia+持久化',
+    url: 'pinia',
+  },
+  {
+    name: '微信分享',
+    url: 'mp-weixin-share',
+  },
+  {
+    name: '自定义导航栏',
+    url: 'navbar',
+  },
+  {
+    name: '自定义导航栏渐变',
+    url: 'throughout',
+  },
+  {
+    name: '请求封装+请求拦截器',
+    url: 'request',
+  },
+  {
+    name: 'page自动引入',
+    url: 'pages-auto-import',
+  },
+])
+const goDetailPage = (path: string) => {
+  const url = `/pages/demo/demo/${path}`
+  uni.navigateTo({
+    url,
+  })
+}
+</script>
+
+<style>
+.content {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+}
+
+.logo {
+  width: 200rpx;
+  height: 200rpx;
+  margin: 200rpx auto 50rpx;
+}
+
+.text-area {
+  display: flex;
+  justify-content: center;
+}
+
+.title {
+  font-size: 36rpx;
+  color: #8f8f94;
+}
+</style>

src/pages/index/index.vue

@@ -4,120 +4,17 @@
   style: { navigationBarTitleText: '首页' },
 }
 </route>
-
 <template>
-  <view class="bg-slate-100">
-    <view class="bg-slate-100 w-full">
-      <view v-for="item in list" :key="item.url" class="mt-3">
-        <view
-          class="flex bg-white items-center justify-between p-3 mb-2"
-          @click="goDetailPage(item.url)"
-        >
-          <text class="flex-1 text-4 text-dark">{{ item.name }}</text>
-          <text class="i-carbon-chevron-right"></text>
-        </view>
-      </view>
+  <view class="bg-white h-full overflow-hidden pt-24 px-4">
+    <view class="mt-8">
+      <image src="/static/logo.png" alt="" class="w-20 h-20 block mx-auto" />
+      <view class="text-2xl text-center mt-4 font-bold"> vue3-uniapp-template </view>
     </view>
-    <view class="m-4">
-      <text>测试配置exclude后，还会自动导入页面吗？</text>
-      <PagesAutoImport />
+    <view class="mt-8">
+      <view class="text-center mt-4 font-bold">开箱即用的 uniapp+vue3+ts 模板</view>
+      <!-- <view class="text-center mt-4 font-bold">欢迎使用 </view> -->
     </view>
   </view>
 </template>
 
-<script setup lang="ts" name="TestIndex">
-import { ref } from 'vue'
-import { onShareAppMessage, onShareTimeline } from '@dcloudio/uni-app'
-import PagesAutoImport from './components/pages-auto-import.vue'
-/** 激活“分享给好友” */
-onShareAppMessage((options: Page.ShareAppMessageOption): Page.CustomShareContent => {
-  console.log('options:', options)
-  return {
-    title: '自定义分享标题',
-    path: '/pages/index/index?id=xxx',
-    imageUrl:
-      'https://cip-shopping-page-0eysug01066a9e-1302818703.tcloudbaseapp.com/pretty-girl.png',
-  }
-})
-/** 激活“分享到朋友圈”， 注意：需要先激活“分享给好友” */
-onShareTimeline((): Page.ShareTimelineContent => {
-  return {
-    title: '自定义分享标题',
-    query: 'a=1&b=2',
-  }
-})
-
-const list = ref([
-  {
-    name: 'UnoCSS',
-    url: 'unocss',
-  },
-  {
-    name: 'UnoCSS Icons',
-    url: 'unocss-icons',
-  },
-  {
-    name: 'UniUI',
-    url: 'uni-ui',
-  },
-  {
-    name: 'UniUI Icons',
-    url: 'uni-ui-icons',
-  },
-  {
-    name: 'Pinia+持久化',
-    url: 'pinia',
-  },
-  {
-    name: '微信分享',
-    url: 'mp-weixin-share',
-  },
-  {
-    name: '自定义导航栏',
-    url: 'navbar',
-  },
-  {
-    name: '自定义导航栏渐变',
-    url: 'throughout',
-  },
-  {
-    name: '请求封装+请求拦截器',
-    url: 'request',
-  },
-  {
-    name: 'page自动引入',
-    url: 'pages-auto-import',
-  },
-])
-const goDetailPage = (path: string) => {
-  const url = `/pages/index/demo/${path}`
-  uni.navigateTo({
-    url,
-  })
-}
-</script>
-
-<style>
-.content {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-}
-
-.logo {
-  width: 200rpx;
-  height: 200rpx;
-  margin: 200rpx auto 50rpx;
-}
-
-.text-area {
-  display: flex;
-  justify-content: center;
-}
-
-.title {
-  font-size: 36rpx;
-  color: #8f8f94;
-}
-</style>
+<script lang="ts" setup></script>

uni-pages.d.ts

@@ -5,31 +5,32 @@
 
 interface NavigateToOptions {
   url: "pages/index/index" |
-       "pages/demo/clock" |
-       "pages/demo/lottery" |
-       "pages/demo/lottery2" |
+       "pages/demo/index" |
        "pages/login/login" |
-       "pages/lottery/big-wheel" |
-       "pages/lottery/nine-grid" |
        "pages/my/index" |
-       "pages/throughout/index" |
-       "pages/demo/img-min/index" |
-       "pages/index/demo/component-auto-import" |
-       "pages/index/demo/mp-weixin-share" |
-       "pages/index/demo/navbar" |
-       "pages/index/demo/pages-auto-import" |
-       "pages/index/demo/pinia" |
-       "pages/index/demo/request" |
-       "pages/index/demo/throughout" |
-       "pages/index/demo/uni-ui-icons" |
-       "pages/index/demo/uni-ui" |
-       "pages/index/demo/unocss-icons" |
-       "pages/index/demo/unocss";
+       "pages/demo/demo/clock" |
+       "pages/demo/demo/component-auto-import" |
+       "pages/demo/demo/lottery" |
+       "pages/demo/demo/lottery2" |
+       "pages/demo/demo/mp-weixin-share" |
+       "pages/demo/demo/navbar" |
+       "pages/demo/demo/pages-auto-import" |
+       "pages/demo/demo/pinia" |
+       "pages/demo/demo/request" |
+       "pages/demo/demo/throughout" |
+       "pages/demo/demo/uni-ui-icons" |
+       "pages/demo/demo/uni-ui" |
+       "pages/demo/demo/unocss-icons" |
+       "pages/demo/demo/unocss" |
+       "pages/demo/demo/img-min/index" |
+       "pages/demo/demo/lottery/big-wheel" |
+       "pages/demo/demo/lottery/nine-grid" |
+       "pages/demo/demo/throughout/index";
 }
 interface RedirectToOptions extends NavigateToOptions {}
 
 interface SwitchTabOptions {
-  url: 'pages/index/index' | 'pages/throughout/index'
+  url: 'pages/index/index' | 'pages/demo/index' | 'pages/my/index'
 }
 
 type ReLaunchOptions = NavigateToOptions | SwitchTabOptions

vite.config.ts

@@ -46,7 +46,9 @@ export default ({ command, mode }) => {
   return defineConfig({
     envDir: './env', // 自定义env目录
     plugins: [
-      UniPages({ exclude: ['**/components/**/**.*'] }),
+      UniPages({
+        exclude: ['**/components/**/**.*'],
+      }),
       UniLayouts(),
       UniPlatform(),
       UniManifest(),