Skip to content

Commit be9de65

Browse files
ZakaryCodeZakaryCode
committed
feat: 调整 icons mdx 导出
1 parent 5e5300e commit be9de65

29 files changed

+29
-55
lines changed

‎docs/README.mdx

+1-1
Original file line numberDiff line numberDiff line change
@@ -3,10 +3,10 @@ title: Taro 介绍
33
---
44

55
import Link from '@docusaurus/Link'
6+
import { ReactIcon, VueIcon } from '@site/static/icons'
67
import TabItem from '@theme/TabItem'
78
import Tabs from '@theme/Tabs'
89

9-
import { ReactIcon, VueIcon } from './guides/index'
1010
import News from './news'
1111

1212
## 简介

‎docs/come-from-miniapp.mdx

+1-2
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,10 @@
22
title: 从原生小程序迁移过来？
33
---
44

5+
import { ReactIcon, VueIcon } from '@site/static/icons'
56
import TabItem from '@theme/TabItem'
67
import Tabs from '@theme/Tabs'
78

8-
import { ReactIcon, VueIcon } from './guides/index'
9-
109
本篇将讲述 Taro 开发和原生小程序开发的主要差异。希望能帮助掌握原生小程序开发，但不太了解 Taro 的同学快速进行迁移。
1110

1211
## 全局变量

‎docs/custom-tabbar.mdx

+1-2
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,10 @@
22
title: 微信小程序自定义 Tabbar
33
---
44

5+
import { ReactIcon, VueIcon } from '@site/static/icons'
56
import TabItem from '@theme/TabItem'
67
import Tabs from '@theme/Tabs'
78

8-
import { ReactIcon, VueIcon } from './guides/index'
9-
109
Taro 支持使用 React、Vue、或者小程序原生语法来编写小程序自定义 TabBar 组件。
1110

1211
## 示例项目

‎docs/guide.mdx

+1-2
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,10 @@
22
title: 渐进式入门教程
33
---
44

5+
import { ReactIcon, VueIcon, Wechat } from '@site/static/icons'
56
import TabItem from '@theme/TabItem'
67
import Tabs from '@theme/Tabs'
78

8-
import { ReactIcon, VueIcon, Wechat } from './guides/index'
9-
109
## 在我们开始之前
1110

1211
我们将在这个教程开发一个简单的 V2EX 论坛客户端，你将在本节教程学到 Taro 的基础知识、概念和部分优化技巧。学习这些知识并不需要事先了解 Taro、小程序开发或多端开发。当你掌握这些知识之后，你应该可以快速高效地开发多端应用。

‎docs/hybrid.mdx

+1-2
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,10 @@
22
title: Taro 使用原生模块
33
---
44

5+
import { ReactIcon, VueIcon } from '@site/static/icons'
56
import TabItem from '@theme/TabItem'
67
import Tabs from '@theme/Tabs'
78

8-
import { ReactIcon, VueIcon } from './guides/index'
9-
109
Taro 支持使用小程序原生的**页面**、**组件**和**插件**。
1110

1211
#### 示例项目：

‎docs/optimized.mdx

+1-2
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,10 @@
22
title: 小程序性能优化指南
33
---
44

5+
import { ReactIcon, VueIcon } from '@site/static/icons'
56
import TabItem from '@theme/TabItem'
67
import Tabs from '@theme/Tabs'
78

8-
import { ReactIcon, VueIcon } from './guides/index'
9-
109
Taro 3 为了兼容 React、Vue 等 Web 开发框架，在运行时对浏览器环境进行模拟，实现了 BOM 和 DOM 等一系列 API。相比 Taro 1/2，Taro 3 是一款重运行时、轻编译时的框架，在性能方面会有一定损耗。因此 Taro 3 提供了一系列的性能优化手段，从而提升 Taro 3 应用的性能。
1110

1211
## 优化更新性能

‎docs/page-config.mdx

+1-2
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,10 @@
22
title: 页面配置
33
---
44

5+
import { ReactIcon, VueIcon } from '@site/static/icons'
56
import TabItem from '@theme/TabItem'
67
import Tabs from '@theme/Tabs'
78

8-
import { ReactIcon, VueIcon } from './guides/index'
9-
109
每一个小程序页面都可以使用 `.config.js` 文件来对本页面的窗口表现进行配置。页面中配置项在当前页面会覆盖全局配置 `app.config.json` 的 `window` 中相同的配置项。
1110

1211
文件需要 `export` 一个默认对象，配置项遵循**微信小程序规范**，并且对所有平台进行统一。

‎docs/ref.mdx

+1-2
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,10 @@
22
title: 节点获取
33
---
44

5+
import { ReactIcon, VueIcon } from '@site/static/icons'
56
import TabItem from '@theme/TabItem'
67
import Tabs from '@theme/Tabs'
78

8-
import { ReactIcon, VueIcon } from './guides/index'
9-
109
在 Web 开发中，常用的节点获取方法包括了 `document.getElementById` 等 DOM API，以及各开发框架的 `ref` 语法。而在 Taro 中，一般情况下建议使用 `ref` 语法来获取节点。但受限于[小程序平台的实现机制](implement-note#运行时)，如果需要获取节点的**尺寸、定位等与渲染有关的信息**，开发者需要使用 `Taro.createSelectorQuery` API 来获取节点。
1110

1211
## ref 语法

‎docs/router-extend.mdx

+1-2
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,10 @@
22
title: 路由库
33
---
44

5+
import { ReactIcon, VueIcon } from '@site/static/icons'
56
import TabItem from '@theme/TabItem'
67
import Tabs from '@theme/Tabs'
78

8-
import { ReactIcon, VueIcon } from './guides/index'
9-
109
:::note
1110
Taro v3.6 开始支持。
1211
:::

‎docs/router.mdx

+1-2
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,10 @@
22
title: 概述
33
---
44

5+
import { ReactIcon, VueIcon } from '@site/static/icons'
56
import TabItem from '@theme/TabItem'
67
import Tabs from '@theme/Tabs'
78

8-
import { ReactIcon, VueIcon } from './guides/index'
9-
109
本篇将介绍如何在 Taro 中配置路由、实现路由跳转和传参等方法。
1110

1211
## 路由配置

‎docs/taro-in-miniapp.mdx

+1-2
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,10 @@
22
title: 原生项目使用 Taro
33
---
44

5+
import { ReactIcon, VueIcon } from '@site/static/icons'
56
import TabItem from '@theme/TabItem'
67
import Tabs from '@theme/Tabs'
78

8-
import { ReactIcon, VueIcon } from './guides/index'
9-
109
:::info
1110
Taro v3.0.25 开始支持
1211
:::

‎docs/use-h5.mdx

+1-2
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,10 @@
22
title: 使用 HTML 标签
33
---
44

5+
import { ReactIcon, VueIcon } from '@site/static/icons'
56
import TabItem from '@theme/TabItem'
67
import Tabs from '@theme/Tabs'
78

8-
import { ReactIcon, VueIcon } from './guides/index'
9-
109
> Taro v3.3+ 开始支持
1110
1211
多年以来 Web 端沉淀了大量优秀的库和组件，我们希望能直接在小程序端进行复用。此外，我们希望能减少 H5 应用迁移到小程序端的成本，甚至能够直接运行在小程序端。因此，自 v3.3 起支持使用 HTML 标签编写 Taro 应用。

‎docs/vant.mdx

+1-2
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,10 @@
22
title: 使用 Vant Weapp
33
---
44

5+
import { ReactIcon, VueIcon } from '@site/static/icons'
56
import TabItem from '@theme/TabItem'
67
import Tabs from '@theme/Tabs'
78

8-
import { ReactIcon, VueIcon } from './guides/index'
9-
109
Taro3 支持使用 [Vant Weapp](https://youzan.github.io/vant-weapp/#/intro) 组件库进行开发，示例仓库：[taro3-vant-sample](https://github.com/NervJS/taro3-vant-sample)。
1110

1211
> 注意：使用原生第三方组件库进行开发的项目，**不再具有多端转换的能力**。

‎docs/virtual-list.mdx

+1-2
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,10 @@
22
title: 长列表渲染（虚拟列表）
33
---
44

5+
import { ReactIcon, VueIcon } from '@site/static/icons'
56
import TabItem from '@theme/TabItem'
67
import Tabs from '@theme/Tabs'
78

8-
import { ReactIcon, VueIcon } from './guides/index'
9-
109
在典型的 Taro 应用中，正常的列表渲染遵循以下的逻辑：
1110

1211
1. 生成或从远程加载数据

‎docs/virtual-waterfall.mdx

+1-2
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,10 @@
22
title: 多列表渲染（虚拟瀑布流）
33
---
44

5+
import { ReactIcon, VueIcon } from '@site/static/icons'
56
import TabItem from '@theme/TabItem'
67
import Tabs from '@theme/Tabs'
78

8-
import { ReactIcon, VueIcon } from './guides/index'
9-
109
与[虚拟列表](./virtual-list)原理一致，通过只渲染**当前可视区域(visible viewport)**的视图，可以极大程度提升多列表渲染时的性能。
1110

1211
> v3.6.10 及以下不支持。

‎docs/guides/index.js renamed to ‎static/icons/index.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -62,7 +62,7 @@ export function VueIcon ({ version = '' }) {
6262
d="M781.1 123.6H615.6L512 303 408.4 123.6H242.9L512 589.7z"
6363
></path>
6464
</svg>
65-
<span style={{color: VueColor}}>Vue{version ? ` ${version}` : ''}</span>
65+
<span style={{ color: VueColor }}>Vue{version ? ` ${version}` : ''}</span>
6666
</span>
6767
)
6868
}

‎versioned_docs/version-3.x/README.mdx

+1-1
Original file line numberDiff line numberDiff line change
@@ -3,10 +3,10 @@ title: Taro 介绍
33
---
44

55
import Link from '@docusaurus/Link'
6+
import { ReactIcon, VueIcon } from '@site/static/icons'
67
import TabItem from '@theme/TabItem'
78
import Tabs from '@theme/Tabs'
89

9-
import { ReactIcon, VueIcon } from './guides/index'
1010
import News from './news'
1111

1212
## 简介

‎versioned_docs/version-3.x/come-from-miniapp.mdx

+1-2
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,10 @@
22
title: 从原生小程序迁移过来？
33
---
44

5+
import { ReactIcon, VueIcon } from '@site/static/icons'
56
import TabItem from '@theme/TabItem'
67
import Tabs from '@theme/Tabs'
78

8-
import { ReactIcon, VueIcon } from './guides/index'
9-
109
本篇将讲述 Taro 开发和原生小程序开发的主要差异。希望能帮助掌握原生小程序开发，但不太了解 Taro 的同学快速进行迁移。
1110

1211
## 全局变量

‎versioned_docs/version-3.x/custom-tabbar.mdx

+1-2
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,10 @@
22
title: 微信小程序自定义 Tabbar
33
---
44

5+
import { ReactIcon, VueIcon } from '@site/static/icons'
56
import TabItem from '@theme/TabItem'
67
import Tabs from '@theme/Tabs'
78

8-
import { ReactIcon, VueIcon } from './guides/index'
9-
109
Taro 支持使用 React、Vue、或者小程序原生语法来编写小程序自定义 TabBar 组件。
1110

1211
## 示例项目

‎versioned_docs/version-3.x/guide.mdx

+1-2
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,10 @@
22
title: 渐进式入门教程
33
---
44

5+
import { ReactIcon, VueIcon } from '@site/static/icons'
56
import TabItem from '@theme/TabItem'
67
import Tabs from '@theme/Tabs'
78

8-
import { ReactIcon, VueIcon, Wechat } from './guides/index'
9-
109
## 在我们开始之前
1110

1211
我们将在这个教程开发一个简单的 V2EX 论坛客户端，你将在本节教程学到 Taro 的基础知识、概念和部分优化技巧。学习这些知识并不需要事先了解 Taro、小程序开发或多端开发。当你掌握这些知识之后，你应该可以快速高效地开发多端应用。

‎versioned_docs/version-3.x/hybrid.mdx

+1-2
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,10 @@
22
title: Taro 使用原生模块
33
---
44

5+
import { ReactIcon, VueIcon } from '@site/static/icons'
56
import TabItem from '@theme/TabItem'
67
import Tabs from '@theme/Tabs'
78

8-
import { ReactIcon, VueIcon } from './guides/index'
9-
109
Taro 支持使用小程序原生的**页面**、**组件**和**插件**。
1110

1211
#### 示例项目：

‎versioned_docs/version-3.x/optimized.mdx

+1-2
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,10 @@
22
title: 小程序性能优化指南
33
---
44

5+
import { ReactIcon, VueIcon } from '@site/static/icons'
56
import TabItem from '@theme/TabItem'
67
import Tabs from '@theme/Tabs'
78

8-
import { ReactIcon, VueIcon } from './guides/index'
9-
109
Taro 3 为了兼容 React、Vue 等 Web 开发框架，在运行时对浏览器环境进行模拟，实现了 BOM 和 DOM 等一系列 API。相比 Taro 1/2，Taro 3 是一款重运行时、轻编译时的框架，在性能方面会有一定损耗。因此 Taro 3 提供了一系列的性能优化手段，从而提升 Taro 3 应用的性能。
1110

1211
## 优化更新性能

‎versioned_docs/version-3.x/page-config.mdx

+1-2
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,10 @@
22
title: 页面配置
33
---
44

5+
import { ReactIcon, VueIcon } from '@site/static/icons'
56
import TabItem from '@theme/TabItem'
67
import Tabs from '@theme/Tabs'
78

8-
import { ReactIcon, VueIcon } from './guides/index'
9-
109
每一个小程序页面都可以使用 `.config.js` 文件来对本页面的窗口表现进行配置。页面中配置项在当前页面会覆盖全局配置 `app.config.json` 的 `window` 中相同的配置项。
1110

1211
文件需要 `export` 一个默认对象，配置项遵循**微信小程序规范**，并且对所有平台进行统一。

‎versioned_docs/version-3.x/ref.mdx

+1-2
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,10 @@
22
title: 节点获取
33
---
44

5+
import { ReactIcon, VueIcon } from '@site/static/icons'
56
import TabItem from '@theme/TabItem'
67
import Tabs from '@theme/Tabs'
78

8-
import { ReactIcon, VueIcon } from './guides/index'
9-
109
在 Web 开发中，常用的节点获取方法包括了 `document.getElementById` 等 DOM API，以及各开发框架的 `ref` 语法。而在 Taro 中，一般情况下建议使用 `ref` 语法来获取节点。但受限于[小程序平台的实现机制](implement-note#运行时)，如果需要获取节点的**尺寸、定位等与渲染有关的信息**，开发者需要使用 `Taro.createSelectorQuery` API 来获取节点。
1110

1211
## ref 语法

‎versioned_docs/version-3.x/router-extend.mdx

+1-2
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,10 @@
22
title: 路由库
33
---
44

5+
import { ReactIcon, VueIcon } from '@site/static/icons'
56
import TabItem from '@theme/TabItem'
67
import Tabs from '@theme/Tabs'
78

8-
import { ReactIcon, VueIcon } from './guides/index'
9-
109
:::note
1110
Taro v3.6 开始支持。
1211
:::

‎versioned_docs/version-3.x/router.mdx

+1-2
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,10 @@
22
title: 概述
33
---
44

5+
import { ReactIcon, VueIcon } from '@site/static/icons'
56
import TabItem from '@theme/TabItem'
67
import Tabs from '@theme/Tabs'
78

8-
import { ReactIcon, VueIcon } from './guides/index'
9-
109
本篇将介绍如何在 Taro 中配置路由、实现路由跳转和传参等方法。
1110

1211
## 路由配置

‎versioned_docs/version-3.x/taro-in-miniapp.mdx

+1-2
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,10 @@
22
title: 原生项目使用 Taro
33
---
44

5+
import { ReactIcon, VueIcon } from '@site/static/icons'
56
import TabItem from '@theme/TabItem'
67
import Tabs from '@theme/Tabs'
78

8-
import { ReactIcon, VueIcon } from './guides/index'
9-
109
:::info
1110
Taro v3.0.25 开始支持
1211
:::

‎versioned_docs/version-3.x/use-h5.mdx

+1-2
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,10 @@
22
title: 使用 HTML 标签
33
---
44

5+
import { ReactIcon, VueIcon } from '@site/static/icons'
56
import TabItem from '@theme/TabItem'
67
import Tabs from '@theme/Tabs'
78

8-
import { ReactIcon, VueIcon } from './guides/index'
9-
109
> Taro v3.3+ 开始支持
1110
1211
多年以来 Web 端沉淀了大量优秀的库和组件，我们希望能直接在小程序端进行复用。此外，我们希望能减少 H5 应用迁移到小程序端的成本，甚至能够直接运行在小程序端。因此，自 v3.3 起支持使用 HTML 标签编写 Taro 应用。

‎versioned_docs/version-3.x/vant.mdx

+1-2
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,10 @@
22
title: 使用 Vant Weapp
33
---
44

5+
import { ReactIcon, VueIcon } from '@site/static/icons'
56
import TabItem from '@theme/TabItem'
67
import Tabs from '@theme/Tabs'
78

8-
import { ReactIcon, VueIcon } from './guides/index'
9-
109
Taro3 支持使用 [Vant Weapp](https://youzan.github.io/vant-weapp/#/intro) 组件库进行开发，示例仓库：[taro3-vant-sample](https://github.com/NervJS/taro3-vant-sample)。
1110

1211
> 注意：使用原生第三方组件库进行开发的项目，**不再具有多端转换的能力**。

0 commit comments

Comments
 (0)