From 7f65149ef3a5e077ece80d6322e95e453a9ba04d Mon Sep 17 00:00:00 2001 From: CharleeWa <18888351756@163.com> Date: Tue, 30 Jul 2024 12:01:36 +0800 Subject: [PATCH] chore: use custom anchor points --- guide/index.md | 4 ++-- vue3-vant-mobile/directory.md | 2 +- vue3-vant-mobile/icons.md | 10 +++++----- vue3-vant-mobile/index.md | 12 ++++++------ 4 files changed, 14 insertions(+), 14 deletions(-) diff --git a/guide/index.md b/guide/index.md index 0185b39..c2b3ff9 100644 --- a/guide/index.md +++ b/guide/index.md @@ -1,7 +1,7 @@ -# :wave: 介绍 +# :wave: 介绍 {#intro} [EasyTemplate](https://github.com/easy-temps) 是一个基于 [Vue 3](https://cn.vuejs.org/) 生态系统的开源模板组织,旨在构建开箱即用的移动、中后台模板,帮助你快速完成业务开发。所有模板全部采用 `ECMAScript` 模块(ESM)规范来编写和组织代码,使用了最新的 `Vue3`、`Vite5`、`TypeScript`、`Pinia`、`Unocss` 等主流技术开发,其中每个模板因使用场景不同,也有各自的生态,这一点请看具体模板的介绍。 -## :pencil: 进展 +## :pencil: 进展 {#plan} 目前,[vue3-vant-mobile](https://github.com/easy-temps/vue3-vant-mobile) 和 [vue3-varlet-mobile](https://github.com/easy-temps/vue3-varlet-mobile) 移动模板已经稳定可用,作者正在计划实现 [v3](https://github.com/easy-temps/vue3-vant-mobile/issues/84) 版本;同时针对 `SSR` 场景,[nuxt3-vant-mobile](https://github.com/easy-temps/nuxt3-vant-mobile) 也在实现中。作者计划2024年8月份完成所有移动模板的实现,后面主要关注两个中后台模板项目,分别是[vue3-antdv-admin](https://github.com/easy-temps/vue3-antdv-admin) 和 [vue3-element-admin](https://github.com/easy-temps/vue3-element-admin),这两个中后台模板的功能设计除了现在模板生态里面常见功能外,作者还计划实现工作流审批、低代码设计平台等高级功能特性。敬请期待! diff --git a/vue3-vant-mobile/directory.md b/vue3-vant-mobile/directory.md index 5f9ffef..c18f372 100644 --- a/vue3-vant-mobile/directory.md +++ b/vue3-vant-mobile/directory.md @@ -2,7 +2,7 @@ title: 目录结构 --- -# :open_book: 目录结构 +# :open_book: 目录结构 {#directory} 模板文件结构说明。 diff --git a/vue3-vant-mobile/icons.md b/vue3-vant-mobile/icons.md index 3949726..d343e2f 100644 --- a/vue3-vant-mobile/icons.md +++ b/vue3-vant-mobile/icons.md @@ -4,11 +4,11 @@ description: 如何使用图标 outline: deep --- -# :tada: 图标 +# :tada: 图标 {#icons} 图标是文字的隐喻,可以实现视觉引导和功能划分。 -## 内置图标 +## 内置图标 {#built-in-icons} 内置图标是模板预先提供好的,开发者可以直接使用。模板默认以 [Vant](https://github.com/youzan/vant) 作为移动端组件库,它提供了基于字体的图标集 [Icon](https://vant-ui.github.io/vant/#/zh-CN/icon) 组件。 @@ -20,13 +20,13 @@ outline: deep 大部分时候,内置的图标无法满足我们的需求场景,这就需要引入外部图标集。 -## 外部图标 +## 外部图标 {#external-icons} 我们推荐 [iconify](https://iconify.design/)。它是统一的图标框架,超过 `150` 多个图标集,和 `200,000` 个开源矢量图标,并且会定期更新图标。您可以在 [iconify](https://icon-sets.iconify.design/) 或者 [icones](https://icones.js.org/) 中看到所有的图标集。 使用 `iconify` 有多种方式,我们模板使用 [CSS icon](https://antfu.me/posts/icons-in-pure-css) 方案,此方案由 `@unocss/preset-icons` 提供支持,可以很好的和 [Unocss](https://unocss.dev/) 配合使用。 -### 安装和使用 +### 安装和使用 {#install-use} 假设我们用到 [carbon](https://icones.js.org/collection/carbon) 图标集,首先安装它。 @@ -62,6 +62,6 @@ outline: deep ::: -### 图标插件 +### 图标插件 {#icon-plugin} VSCode 用户,推荐安装 [antfu.iconify](https://marketplace.visualstudio.com/items?itemName=antfu.iconify) 插件。它可以高亮图标的显示和自动完成。 diff --git a/vue3-vant-mobile/index.md b/vue3-vant-mobile/index.md index 14ef373..47a343f 100644 --- a/vue3-vant-mobile/index.md +++ b/vue3-vant-mobile/index.md @@ -3,19 +3,19 @@ title: 介绍 description: 一个基于 Vue 3 生态系统的移动 web 应用模板,帮助你快速完成业务开发 --- -# 介绍 +# 介绍 {#intro} [vue3-vant-mobile](https://github.com/easy-temps/vue3-vant-mobile) 是一款开源免费且开箱即用的移动模版,完全采用 `ECMAScript` 模块(`ESM`)规范来编写和组织代码,使用了最新的 `Vue3`、`Vite`、`Vant`、`TypeScript`、`Pinia`、`Unocss` 等主流技术开发。我们还提供了业务当中常用的组件,例如:`Dark Mode`、`i18n`、`Mock`、`ECharts`、`Pinia` 持久化、`KeepAlive` 等示例。总之,开发者借助这个模板,可以继续向上构建自己的业务场景,快速完成开发工作。 -## 在线预览 +## 在线预览 {#preview} :point_right: [Live Demo](https://vue3-vant-mobile.netlify.app/) [![Netlify Status](https://api.netlify.com/api/v1/badges/e6828bd2-2904-4c3e-a67c-b97d32aa1275/deploy-status)](https://app.netlify.com/sites/vue3-vant-mobile/deploys) -## 预配置 +## 预配置 {#preset} -### UI 框架 +### UI 框架 {#ui} - [UnoCSS](https://github.com/antfu/unocss) - 高性能且极具灵活性的即时原子化 CSS 引擎 - [@unocss/preset-rem-to-px](https://github.com/unocss/unocss/tree/main/packages/preset-rem-to-px) - 将所有实用程序的 rem 转换为 px @@ -24,7 +24,7 @@ description: 一个基于 Vue 3 生态系统的移动 web 应用模板,帮助 - [vant-touch-emulator](https://github.com/youzan/vant/tree/main/packages/vant-touch-emulator) - 在桌面端上模拟移动端 touch 事件 - [vant-use](https://github.com/youzan/vant/tree/main/packages/vant-use) - Vant 内置的组合式 API -### 插件 +### 插件 {#plugins} - [Vue Router](https://github.com/vuejs/router) - [unplugin-vue-router](https://github.com/posva/unplugin-vue-router) - 以文件系统为基础的路由 @@ -43,7 +43,7 @@ description: 一个基于 Vue 3 生态系统的移动 web 应用模板,帮助 - [vite-plugin-pwa](https://github.com/antfu/vite-plugin-pwa) - PWA - [vite-plugin-sitemap](https://github.com/jbaubree/vite-plugin-sitemap) - sitemap 和 robots 生成器 -## 问题反馈 +## 问题反馈 {#feedback} 我们推荐使用 [议题](https://github.com/easy-temps/vue3-vant-mobile/issues) 来反馈问题, 或者您也可以通过微信群联系我们。