vue3-vant-mobile/README-zh_CN.md

<h1 align="center">Vue3-Vant-Mobile</h1>

<p align="center">一个集成 Vue3、Vite5、Vant4、Pinia2、Vitest、TypeScript 构建的移动端模板</p>

<p align="center">
  <img src="https://img.shields.io/github/license/CharleeWa/vue3-vant-mobile" alt="license" />
  <img src="https://img.shields.io/github/package-json/v/CharleeWa/vue3-vant-mobile" alt="version" />
  <img src="https://img.shields.io/github/repo-size/CharleeWa/vue3-vant-mobile" alt="repo-size" />
  <img src="https://img.shields.io/github/languages/top/CharleeWa/vue3-vant-mobile" alt="languages" />
  <img src="https://img.shields.io/github/issues-closed/CharleeWa/vue3-vant-mobile" alt="issues" />
</p>

简体中文 / [English](./README.md) , [使用指南](./Guide-zh_CN.md) / [English Guide](./Guide.md)

## 介绍

🔥 一个集成最新技术栈、完整干净的移动端模板。它简洁、简单、易用，可供参考，能够帮助您节省一周的开发时间，希望您会喜欢。

## 成就

🎉 被添加到 [Awesome Vite.Js](https://github.com/vitejs/awesome-vite#vue-3)

## 特性

- 🌓 支持暗黑模式
- 💪 使用TypeScript编写
- 🚀 Vue3 生态开箱即用
- 🤖 自动导入组件
- 📦 使用pnpm包管理器
- 💾 支持Mock服务器
- 🌈 支持Git hooks（lint和commit）
- 💖 移动端UI组件（Vant4）
- 🍍 Pinia，Vue的状态管理库

## 安装与使用

- 获取项目代码

```bash
git clone https://github.com/CharleeWa/vue3-vant-mobile.git
```

- 安装依赖

```bash
cd vue3-vant-mobile

# with pnpm
pnpm install

```

- 运行

```bash
pnpm dev
```

- 打包构建

```bash
pnpm build
```

## 浏览器支持

支持现代浏览器

| [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt=" Edge" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>IE | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt=" Edge" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Edge | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png" alt="Firefox" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Firefox | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png" alt="Chrome" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Chrome | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png" alt="Safari" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Safari |
| :-: | :-: | :-: | :-: | :-: |
| not support | last 2 versions | last 2 versions | last 2 versions | last 2 versions |

## 贡献者

<table>
<tr>
  <td align="center">
    <a href="https://github.com/CharleeWa">
      <img src="https://avatars.githubusercontent.com/u/22477554?s=96&v=4" width="90;" alt="CharleeWa"/>
      <br />
      <sub><b>Charlie Wang</b></sub>
    </a>
  </td>
  <td align="center">
    <a href="https://github.com/weiq">
      <img src="https://avatars.githubusercontent.com/u/1697158?v=4" width="90;" alt="weiq"/>
      <br />
      <sub><b>魏小雨</b></sub>
    </a>
  </td>
  <td align="center">
    <a href="https://github.com/AlphaYoung111">
      <img src="https://avatars.githubusercontent.com/u/54132313?v=4" width="90;" alt="AlphaYoung"/>
      <br />
      <sub><b>AlphaYoung</b></sub>
    </a>
  </td>
  <td align="center">
    <a href="https://github.com/Leezon">
      <img src="https://avatars.githubusercontent.com/u/38120280?v=4" width="90;" alt="Leezon"/>
      <br />
      <sub><b>Leezon</b></sub>
    </a>
  </td>
  <td align="center">
    <a href="https://github.com/leo4developer">
      <img src="https://avatars.githubusercontent.com/u/15160478?v=4" width="90;" alt="liuNing"/>
      <br />
      <sub><b>liuNing</b></sub>
    </a>
  </td>
  <td align="center">
    <a href="https://github.com/wswmsword">
      <img src="https://avatars.githubusercontent.com/u/26893092?v=4" width="90;" alt="wswmsword"/>
      <br />
      <sub><b>wswmsword</b></sub>
    </a>
  </td>
</tr>
<tr>
  <td align="center">
    <a href="https://github.com/Kysen777">
      <img src="https://avatars.githubusercontent.com/u/63892082?v=4" width="90;" alt="Kysen"/>
      <br />
      <sub><b>Kysen</b></sub>
    </a>
  </td>
  <td align="center">
    <a href="https://github.com/smartsf">
      <img src="https://avatars.githubusercontent.com/u/19995400?v=4" width="90;" alt="smartsf"/>
      <br />
      <sub><b>阿峰</b></sub>
    </a>
  </td>
  <td align="center">
    <a href="https://github.com/ReginYuan">
      <img src="https://avatars.githubusercontent.com/u/49477488?v=4" width="90;" alt="ReginYuan"/>
      <br />
      <sub><b>ReginYuan</b></sub>
    </a>
  </td>
</tr>
</table>

## 星星趋势

<p align="left">
  <a target="_blank" href="https://star-history.com/#CharleeWa/vue3-vant-mobile&Date">
    <picture>
      <source media="(prefers-color-scheme: dark)" srcset="https://api.star-history.com/svg?repos=CharleeWa/vue3-vant-mobile&type=Date&theme=dark">
      <img alt="Star History Chart" src="https://api.star-history.com/svg?repos=CharleeWa/vue3-vant-mobile&type=Date">
    </picture>
  </a>
</p>