项目介绍

基于 uni-app + Vue 3 + TypeScript 移动端跨平台开发模板，集成了 ESLint、Prettier、Stylelint、Husky 和 Commitlint 等工具，确保代码规范与质量。

项目截图

项目文档

从0到1构建 UniApp + Vue3 + TypeScript 移动端跨平台开源脚手架

项目启动

安装依赖

pnpm install

h5启动

pnpm run dev:h5

访问 http://localhost:4096

组件结构

项目组件分为以下几类：

• 基础组件：src/components 下的通用组件
• 业务组件：src/components/business 下的业务相关组件
  • WechatProfile.vue: 微信小程序环境下的头像、昵称和性别选择组件

使用业务组件：

<template>
  <WechatProfile v-model="profileData" @change="onProfileChange" />
</template>

<script lang="ts" setup>
import { ref } from "vue";
import { WechatProfile } from "@/components/business";

const profileData = ref({
  avatar: "",
  nickname: "",
  gender: 1,
});

const onProfileChange = (data) => {
  console.log("个人资料变更:", data);
};
</script>