diff --git a/packages/taro-components/src/components/ad-custom/ad-custom.tsx b/packages/taro-components/src/components/ad-custom/ad-custom.tsx
new file mode 100644
index 000000000000..a2e7dbae563a
--- /dev/null
+++ b/packages/taro-components/src/components/ad-custom/ad-custom.tsx
@@ -0,0 +1,17 @@
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+import { Component, h, Host } from '@stencil/core'
+
+@Component({
+  tag: 'taro-ad-custom-core'
+})
+export class AdCustom {
+  componentDidLoad () {
+    console.error('H5 暂不支持 AdCustom 组件！')
+  }
+
+  render () {
+    return (
+      <Host />
+    )
+  }
+}
diff --git a/packages/taro-components/src/components/ad/ad.tsx b/packages/taro-components/src/components/ad/ad.tsx
new file mode 100644
index 000000000000..26ab00cfcd7c
--- /dev/null
+++ b/packages/taro-components/src/components/ad/ad.tsx
@@ -0,0 +1,17 @@
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+import { Component, h, Host } from '@stencil/core'
+
+@Component({
+  tag: 'taro-ad-core'
+})
+export class Ad {
+  componentDidLoad () {
+    console.error('H5 暂不支持 Ad 组件！')
+  }
+
+  render () {
+    return (
+      <Host />
+    )
+  }
+}
diff --git a/packages/taro-components/src/components/editor/editor.tsx b/packages/taro-components/src/components/editor/editor.tsx
new file mode 100644
index 000000000000..b031f3f0f4b4
--- /dev/null
+++ b/packages/taro-components/src/components/editor/editor.tsx
@@ -0,0 +1,17 @@
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+import { Component, h, Host } from '@stencil/core'
+
+@Component({
+  tag: 'taro-editor-core'
+})
+export class Editor {
+  componentDidLoad () {
+    console.error('H5 暂不支持 Editor 组件！')
+  }
+
+  render () {
+    return (
+      <Host />
+    )
+  }
+}
diff --git a/packages/taro-components/src/components/functional-page-navigator/functional-page-navigator.tsx b/packages/taro-components/src/components/functional-page-navigator/functional-page-navigator.tsx
new file mode 100644
index 000000000000..de6364824cee
--- /dev/null
+++ b/packages/taro-components/src/components/functional-page-navigator/functional-page-navigator.tsx
@@ -0,0 +1,17 @@
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+import { Component, h, Host } from '@stencil/core'
+
+@Component({
+  tag: 'taro-functional-page-navigator-core'
+})
+export class FunctionalPageNavigator {
+  componentDidLoad () {
+    console.error('H5 暂不支持 FunctionalPageNavigator 组件！')
+  }
+
+  render () {
+    return (
+      <Host />
+    )
+  }
+}
diff --git a/packages/taro-components/src/components/keyboard-accessory/keyboard-accessory.tsx b/packages/taro-components/src/components/keyboard-accessory/keyboard-accessory.tsx
new file mode 100644
index 000000000000..f7cfb93c0819
--- /dev/null
+++ b/packages/taro-components/src/components/keyboard-accessory/keyboard-accessory.tsx
@@ -0,0 +1,17 @@
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+import { Component, h, Host } from '@stencil/core'
+
+@Component({
+  tag: 'taro-keyboard-accessory-core'
+})
+export class KeyboardAccessory {
+  componentDidLoad () {
+    console.error('H5 暂不支持 KeyboardAccessory 组件！')
+  }
+
+  render () {
+    return (
+      <Host />
+    )
+  }
+}
diff --git a/packages/taro-components/src/components/live-player/live-player.tsx b/packages/taro-components/src/components/live-player/live-player.tsx
new file mode 100644
index 000000000000..30ee55726194
--- /dev/null
+++ b/packages/taro-components/src/components/live-player/live-player.tsx
@@ -0,0 +1,17 @@
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+import { Component, h, Host } from '@stencil/core'
+
+@Component({
+  tag: 'taro-live-player-core'
+})
+export class LivePlayer {
+  componentDidLoad () {
+    console.error('H5 暂不支持 LivePlayer 组件！')
+  }
+
+  render () {
+    return (
+      <Host />
+    )
+  }
+}
diff --git a/packages/taro-components/src/components/live-pusher/live-pusher.tsx b/packages/taro-components/src/components/live-pusher/live-pusher.tsx
new file mode 100644
index 000000000000..3f3bd1840812
--- /dev/null
+++ b/packages/taro-components/src/components/live-pusher/live-pusher.tsx
@@ -0,0 +1,17 @@
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+import { Component, h, Host } from '@stencil/core'
+
+@Component({
+  tag: 'taro-live-pusher-core'
+})
+export class LivePusher {
+  componentDidLoad () {
+    console.error('H5 暂不支持 LivePusher 组件！')
+  }
+
+  render () {
+    return (
+      <Host />
+    )
+  }
+}
diff --git a/packages/taro-components/src/components/map/map.tsx b/packages/taro-components/src/components/map/map.tsx
new file mode 100644
index 000000000000..92fed693055a
--- /dev/null
+++ b/packages/taro-components/src/components/map/map.tsx
@@ -0,0 +1,17 @@
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+import { Component, h, Host } from '@stencil/core'
+
+@Component({
+  tag: 'taro-map-core'
+})
+export class Map {
+  componentDidLoad () {
+    console.error('H5 暂不支持 Map 组件！')
+  }
+
+  render () {
+    return (
+      <Host />
+    )
+  }
+}
diff --git a/packages/taro-components/src/components/match-media/match-media.tsx b/packages/taro-components/src/components/match-media/match-media.tsx
new file mode 100644
index 000000000000..1154f67a8b4a
--- /dev/null
+++ b/packages/taro-components/src/components/match-media/match-media.tsx
@@ -0,0 +1,17 @@
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+import { Component, h, Host } from '@stencil/core'
+
+@Component({
+  tag: 'taro-match-media-core'
+})
+export class MatchMedia {
+  componentDidLoad () {
+    console.error('H5 暂不支持 MatchMedia 组件！')
+  }
+
+  render () {
+    return (
+      <Host />
+    )
+  }
+}
diff --git a/packages/taro-components/src/components/movable-view/movable-area.tsx b/packages/taro-components/src/components/movable-area/movable-area.tsx
similarity index 100%
rename from packages/taro-components/src/components/movable-view/movable-area.tsx
rename to packages/taro-components/src/components/movable-area/movable-area.tsx
diff --git a/packages/taro-components/src/components/movable-view/movable-view.tsx b/packages/taro-components/src/components/movable-area/movable-view.tsx
similarity index 100%
rename from packages/taro-components/src/components/movable-view/movable-view.tsx
rename to packages/taro-components/src/components/movable-area/movable-view.tsx
diff --git a/packages/taro-components/src/components/navigation-bar/navigation-bar.tsx b/packages/taro-components/src/components/navigation-bar/navigation-bar.tsx
new file mode 100644
index 000000000000..057eba888b20
--- /dev/null
+++ b/packages/taro-components/src/components/navigation-bar/navigation-bar.tsx
@@ -0,0 +1,17 @@
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+import { Component, h, Host } from '@stencil/core'
+
+@Component({
+  tag: 'taro-navigation-bar-core'
+})
+export class NavigationBar {
+  componentDidLoad () {
+    console.error('H5 暂不支持 NavigationBar 组件！')
+  }
+
+  render () {
+    return (
+      <Host />
+    )
+  }
+}
diff --git a/packages/taro-components/src/components/official-account/official-account.tsx b/packages/taro-components/src/components/official-account/official-account.tsx
new file mode 100644
index 000000000000..284a51101ffc
--- /dev/null
+++ b/packages/taro-components/src/components/official-account/official-account.tsx
@@ -0,0 +1,17 @@
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+import { Component, h, Host } from '@stencil/core'
+
+@Component({
+  tag: 'taro-official-account-core'
+})
+export class OfficialAccount {
+  componentDidLoad () {
+    console.error('H5 暂不支持 OfficialAccount 组件！')
+  }
+
+  render () {
+    return (
+      <Host />
+    )
+  }
+}
diff --git a/packages/taro-components/src/components/page-container/page-container.tsx b/packages/taro-components/src/components/page-container/page-container.tsx
new file mode 100644
index 000000000000..ceede42a0f97
--- /dev/null
+++ b/packages/taro-components/src/components/page-container/page-container.tsx
@@ -0,0 +1,17 @@
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+import { Component, h, Host } from '@stencil/core'
+
+@Component({
+  tag: 'taro-page-container-core'
+})
+export class PageContainer {
+  componentDidLoad () {
+    console.error('H5 暂不支持 PageContainer 组件！')
+  }
+
+  render () {
+    return (
+      <Host />
+    )
+  }
+}
diff --git a/packages/taro-components/src/components/page-meta/page-meta.tsx b/packages/taro-components/src/components/page-meta/page-meta.tsx
new file mode 100644
index 000000000000..d5081051d0ec
--- /dev/null
+++ b/packages/taro-components/src/components/page-meta/page-meta.tsx
@@ -0,0 +1,17 @@
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+import { Component, h, Host } from '@stencil/core'
+
+@Component({
+  tag: 'taro-page-meta-core'
+})
+export class PageMeta {
+  componentDidLoad () {
+    console.error('H5 暂不支持 PageMeta 组件！')
+  }
+
+  render () {
+    return (
+      <Host />
+    )
+  }
+}
diff --git a/packages/taro-components/src/components/picker-view-column/picker-view-column.tsx b/packages/taro-components/src/components/picker-view/picker-view-column.tsx
similarity index 100%
rename from packages/taro-components/src/components/picker-view-column/picker-view-column.tsx
rename to packages/taro-components/src/components/picker-view/picker-view-column.tsx
diff --git a/packages/taro-components/src/components/pull-down-refresh/pull-to-refresh.tsx b/packages/taro-components/src/components/pull-to-refresh/pull-to-refresh.tsx
similarity index 100%
rename from packages/taro-components/src/components/pull-down-refresh/pull-to-refresh.tsx
rename to packages/taro-components/src/components/pull-to-refresh/pull-to-refresh.tsx
diff --git a/packages/taro-components/src/components/pull-down-refresh/style/index.css b/packages/taro-components/src/components/pull-to-refresh/style/index.css
similarity index 100%
rename from packages/taro-components/src/components/pull-down-refresh/style/index.css
rename to packages/taro-components/src/components/pull-to-refresh/style/index.css
diff --git a/packages/taro-components/src/components/share-element/share-element.tsx b/packages/taro-components/src/components/share-element/share-element.tsx
new file mode 100644
index 000000000000..4eaa90c6c177
--- /dev/null
+++ b/packages/taro-components/src/components/share-element/share-element.tsx
@@ -0,0 +1,17 @@
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+import { Component, h, Host } from '@stencil/core'
+
+@Component({
+  tag: 'taro-share-element-core'
+})
+export class ShareElement {
+  componentDidLoad () {
+    console.error('H5 暂不支持 ShareElement 组件！')
+  }
+
+  render () {
+    return (
+      <Host />
+    )
+  }
+}
diff --git a/packages/taro-components/src/components/slot/slot.tsx b/packages/taro-components/src/components/slot/slot.tsx
new file mode 100644
index 000000000000..f8e7397b0fc3
--- /dev/null
+++ b/packages/taro-components/src/components/slot/slot.tsx
@@ -0,0 +1,17 @@
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+import { Component, h, Host } from '@stencil/core'
+
+@Component({
+  tag: 'taro-slot-core'
+})
+export class Slot {
+  componentDidLoad () {
+    console.error('H5 暂不支持 Slot 组件！')
+  }
+
+  render () {
+    return (
+      <Host />
+    )
+  }
+}
diff --git a/packages/taro-components/src/components/voip-room/voip-room.tsx b/packages/taro-components/src/components/voip-room/voip-room.tsx
new file mode 100644
index 000000000000..9f271a19b30d
--- /dev/null
+++ b/packages/taro-components/src/components/voip-room/voip-room.tsx
@@ -0,0 +1,17 @@
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+import { Component, h, Host } from '@stencil/core'
+
+@Component({
+  tag: 'taro-voip-room-core'
+})
+export class VoipRoom {
+  componentDidLoad () {
+    console.error('H5 暂不支持 VoipRoom 组件！')
+  }
+
+  render () {
+    return (
+      <Host />
+    )
+  }
+}
diff --git a/packages/taro-components/src/global.css b/packages/taro-components/src/global.css
new file mode 100644
index 000000000000..e3416e209b78
--- /dev/null
+++ b/packages/taro-components/src/global.css
@@ -0,0 +1,7 @@
+@import url(../node_modules/weui/dist/style/weui.min.css);
+
+.taro_page {
+  max-height: 100vh;
+  overflow-x: hidden;
+  overflow-y: scroll;
+}
diff --git a/packages/taro-components/src/utils/index.js b/packages/taro-components/src/utils/index.ts
similarity index 100%
rename from packages/taro-components/src/utils/index.js
rename to packages/taro-components/src/utils/index.ts
diff --git a/packages/taro-components/stencil.config.ts b/packages/taro-components/stencil.config.ts
index 7b5c3b1a704f..5e865e89ba18 100644
--- a/packages/taro-components/stencil.config.ts
+++ b/packages/taro-components/stencil.config.ts
@@ -4,7 +4,7 @@ const { jsWithTs: tsjPreset } = require('ts-jest/presets')
 
 export const config: Config = {
   namespace: 'taro-components',
-  globalStyle: './node_modules/weui/dist/style/weui.min.css',
+  globalStyle: './src/global.css',
   plugins: [
     sass()
   ],
diff --git a/packages/taro-components/types/Ad.d.ts b/packages/taro-components/types/Ad.d.ts
index 09dce39a2443..8114a767b7ce 100644
--- a/packages/taro-components/types/Ad.d.ts
+++ b/packages/taro-components/types/Ad.d.ts
@@ -11,12 +11,12 @@ interface AdProps extends StandardProps {
    * @supported weapp
    */
   adIntervals?: number
-  
+
   /** 广告类型，默认为展示`banner`，可通过设置该属性为`video`展示视频广告, `grid`为格子广告
    * @supported weapp
    */
   adType?: 'banner' | 'video' | 'grid'
-  
+
   /** 广告主题样式设置
    * @supported weapp
    */
@@ -42,9 +42,9 @@ declare namespace AdProps {
   interface onErrorEventDetail {
     errCode: keyof AdErrCode
   }
-  /** 
+  /**
    * 广告错误码
-   * 
+   *
    * 错误码是通过onError获取到的错误信息。调试期间，可以通过异常返回来捕获信息。
    * 在小程序发布上线之后，如果遇到异常问题，可以在[“运维中心“](https://mp.weixin.qq.com/)里面搜寻错误日志，还可以针对异常返回加上适当的监控信息。
    */
@@ -116,8 +116,8 @@ declare namespace AdProps {
  *   render () {
  *     return (
  *       <Ad
- *         unit-id=''
- *         ad-intervals={60}
+ *         unitId=''
+ *         adIntervals={60}
  *         onLoad={() => console.log('ad onLoad')}
  *         onError={() => console.log('ad onError')}
  *         onClose={() => console.log('ad onClose')}
diff --git a/packages/taro-components/types/AdCustom.d.ts b/packages/taro-components/types/AdCustom.d.ts
new file mode 100644
index 000000000000..b06c942288c8
--- /dev/null
+++ b/packages/taro-components/types/AdCustom.d.ts
@@ -0,0 +1,50 @@
+import { ComponentType } from 'react'
+import { StandardProps, CommonEventFunction } from './common'
+import { AdProps } from './Ad'
+
+interface AdCustomProps extends StandardProps {
+  /** 广告单元id，可在[小程序管理后台](https://mp.weixin.qq.com/)的流量主模块新建
+   * @supported weapp
+   */
+  unitId: string
+
+  /** 广告自动刷新的间隔时间，单位为秒，参数值必须大于等于30（该参数不传入时 Banner 广告不会自动刷新）
+   * @supported weapp
+   */
+  adIntervals?: number
+
+  /** 广告加载成功的回调
+   * @supported weapp
+   */
+  onLoad?: CommonEventFunction
+
+  /** 当广告发生错误时，触发的事件，可以通过该事件获取错误码及原因，事件对象event.detail = {errCode: 1002}
+   * @supported weapp
+   */
+  onError?: CommonEventFunction<AdProps.onErrorEventDetail>
+}
+
+/** Banner 广告
+ * @classification open
+ * @supported weapp
+ * @example
+ * ```tsx
+ * class App extends Component {
+ *   render () {
+ *     return (
+ *       <AdCustom
+ *         unitId=''
+ *         adIntervals={60}
+ *         onLoad={() => console.log('ad onLoad')}
+ *         onError={() => console.log('ad onError')}
+ *         onClose={() => console.log('ad onClose')}
+ *       />
+ *     )
+ *   }
+ * }
+ * ```
+ * @see https://developers.weixin.qq.com/miniprogram/dev/component/ad.html
+ */
+declare const AdCustom: ComponentType<AdCustomProps>
+
+export { AdCustom, AdCustomProps }
diff --git a/packages/taro-components/types/CoverImage.d.ts b/packages/taro-components/types/CoverImage.d.ts
index 96688deba7b2..c219fc127b84 100644
--- a/packages/taro-components/types/CoverImage.d.ts
+++ b/packages/taro-components/types/CoverImage.d.ts
@@ -27,9 +27,9 @@ interface CoverImageProps extends StandardProps {
  *   render () {
  *     return (
  *       <Video id='myVideo' src='src'>
- *         <CoverView class='controls'>
- *           <CoverView class='play' onClick='play'>
- *             <CoverImage class='img' src='src' />
+ *         <CoverView className='controls'>
+ *           <CoverView className='play' onClick={() => { TODO }}>
+ *             <CoverImage className='img' src='src' />
  *           </CoverView>
  *         </CoverView>
  *       </Video>
diff --git a/packages/taro-components/types/CoverView.d.ts b/packages/taro-components/types/CoverView.d.ts
index 24c8155d53f9..03e32609ea59 100644
--- a/packages/taro-components/types/CoverView.d.ts
+++ b/packages/taro-components/types/CoverView.d.ts
@@ -28,9 +28,9 @@ interface CoverViewProps extends ViewProps {
  *   render () {
  *     return (
  *       <Video id='myVideo' src='src'>
- *         <CoverView class='controls'>
- *           <CoverView class='play' onClick='play'>
- *             <CoverImage class='img' src='src' />
+ *         <CoverView className='controls'>
+ *           <CoverView className='play' onClick={() => { TODO }}>
+ *             <CoverImage className='img' src='src' />
  *           </CoverView>
  *         </CoverView>
  *       </Video>
diff --git a/packages/taro-components/types/Image.d.ts b/packages/taro-components/types/Image.d.ts
index cf441376c139..8354a5665257 100644
--- a/packages/taro-components/types/Image.d.ts
+++ b/packages/taro-components/types/Image.d.ts
@@ -100,7 +100,7 @@ declare namespace ImageProps {
 }
 
 /** 图片。支持 JPG、PNG、SVG、WEBP、GIF 等格式以及云文件ID。
- * 
+ *
  * **Note:** 为实现小程序的 `mode` 特性，在 H5 组件中使用一个 `div` 容器来对内部的 `img` 进行展示区域的裁剪，因此请勿使用元素选择器来重置 `img` 的样式！
  * @classification media
  * @supported weapp, h5, rn, swan, alipay, tt
@@ -110,7 +110,7 @@ declare namespace ImageProps {
  *   constructor() {
  *     super(...arguments)
  *   }
- * 
+ *
  *   render() {
  *     return (
  *       <View className='components-page'>
diff --git a/packages/taro-components/types/KeyboardAccessory.d.ts b/packages/taro-components/types/KeyboardAccessory.d.ts
new file mode 100644
index 000000000000..fb8a09ad9999
--- /dev/null
+++ b/packages/taro-components/types/KeyboardAccessory.d.ts
@@ -0,0 +1,29 @@
+import { ComponentType } from 'react'
+import { StandardProps, CommonEventFunction } from './common'
+
+type KeyboardAccessoryProps = StandardProps
+
+/** 设置 input / textarea 聚焦时键盘上方 cover-view / cover-image 工具栏视图
+ *
+ * @classification forms
+ * @supported weapp
+ * @example
+ * ```tsx
+ * class App extends Component {
+ *   render () {
+ *     return (
+ *         <Textarea holdKeyboard="{{true}}">
+ *           <KeyboardAccessory className="container" style={{ height: 50 }} >
+ *             <CoverView onClick={() => { TODO }} style={{ flex: 1, background: 'green' }}>1</CoverView>
+ *             <CoverView onClick={() => { TODO }} style={{ flex: 1, background: 'red' }}>2</CoverView>
+ *           </KeyboardAccessory>
+ *         </Textarea>
+ *     )
+ *   }
+ * }
+ * ```
+ * @see https://developers.weixin.qq.com/miniprogram/dev/component/keyboard-accessory.html
+ */
+declare const KeyboardAccessory: ComponentType<KeyboardAccessoryProps>
+
+export { KeyboardAccessory, KeyboardAccessoryProps }
diff --git a/packages/taro-components/types/PageContainer.d.ts b/packages/taro-components/types/PageContainer.d.ts
new file mode 100644
index 000000000000..398732a42b59
--- /dev/null
+++ b/packages/taro-components/types/PageContainer.d.ts
@@ -0,0 +1,115 @@
+import { ComponentType } from 'react'
+import { StandardProps, CommonEventFunction, BaseEventOrigFunction } from './common'
+
+interface PageContainerProps extends StandardProps {
+  /** 是否显示容器组件
+   * @default false
+   * @supported weapp
+   */
+  show?: boolean
+
+  /** 动画时长，单位毫秒
+   * @default 300
+   * @supported weapp
+   */
+  duration?: number
+
+  /** z-index 层级
+   * @default 100
+   * @supported weapp
+   */
+  zIndex?: number
+
+  /** 是否显示遮罩层
+   * @default true
+   * @supported weapp
+   */
+  overlay?: boolean
+
+  /** 弹出位置，可选值为 top bottom right center
+   * @default bottom
+   * @supported weapp
+   */
+  position?: keyof PageContainerProps.position
+
+  /** 是否显示圆角
+   * @default false
+   * @supported weapp
+   */
+  round?: boolean
+
+  /** 自定义遮罩层样式
+   * @default false
+   * @supported weapp
+   */
+  closeOnSlideDown?: boolean
+
+  /** 是否在下滑一段距离后关闭
+   * @supported weapp
+   */
+  overlayStyle?: boolean
+
+  /** 自定义弹出层样式
+   * @supported weapp
+   */
+  customStyle?: boolean
+
+  /** 进入前触发
+   * @supported weapp
+   */
+  onBeforeEnter?: CommonEventFunction
+
+  /** 进入中触发
+   * @supported weapp
+   */
+  onEnter?: CommonEventFunction
+
+  /** 进入后触发
+   * @supported weapp
+   */
+  onAfterEnter?: CommonEventFunction
+
+  /** 离开前触发
+   * @supported weapp
+   */
+  onBeforeLeave?: CommonEventFunction
+
+  /** 离开中触发
+   * @supported weapp
+   */
+  onLeave?: CommonEventFunction
+
+  /** 离开后触发
+   * @supported weapp
+   */
+  onAfterLeave?: CommonEventFunction
+
+  /** 点击遮罩层时触发
+   * @supported weapp
+   */
+  onClickOverlay?: CommonEventFunction
+}
+
+declare namespace PageContainerProps {
+  interface position {
+    top
+    bottom
+    left
+    right
+  }
+}
+
+/** 页面容器
+ *
+ * 小程序如果在页面内进行复杂的界面设计（如在页面内弹出半屏的弹窗、在页面内加载一个全屏的子页面等），用户进行返回操作会直接离开当前页面，不符合用户预期，预期应为关闭当前弹出的组件。
+ * 为此提供“假页”容器组件，效果类似于 `popup` 弹出层，页面内存在该容器时，当用户进行返回操作，关闭该容器不关闭页面。返回操作包括三种情形，右滑手势、安卓物理返回键和调用 `navigateBack` 接口。
+ *
+ * Bug & Tip
+ *   1. tip: 当前页面最多只有 1 个容器，若已存在容器的情况下，无法增加新的容器
+ *   2. tip: wx.navigateBack 无法在页面栈顶调用，此时没有上一级页面
+ * @classification viewContainer
+ * @see https://developers.weixin.qq.com/miniprogram/dev/component/page-container.html
+ */
+declare const PageContainer: ComponentType<PageContainerProps>
+
+export { PageContainer, PageContainerProps }
diff --git a/packages/taro-components/types/ShareElement.d.ts b/packages/taro-components/types/ShareElement.d.ts
new file mode 100644
index 000000000000..c935cdf9d2cf
--- /dev/null
+++ b/packages/taro-components/types/ShareElement.d.ts
@@ -0,0 +1,39 @@
+import { ComponentType } from 'react'
+import { StandardProps, CommonEventFunction } from './common'
+
+interface ShareElementProps extends StandardProps {
+  /** 映射标记
+   * @supported weapp
+   */
+  key: string
+
+  /** 是否进行动画
+   * @default false
+   * @supported weapp
+   */
+  transform?: boolean
+
+  /** 动画时长，单位毫秒
+   * @default 300
+   * @supported weapp
+   */
+  duration?: number
+
+  /** css缓动函数
+   * @default ease-out
+   * @supported weapp
+   */
+  easingFunction?: number
+}
+
+/** 共享元素
+ *
+ * 共享元素是一种动画形式，类似于 [`flutter Hero`](https://flutterchina.club/animations/hero-animations/) 动画，表现为元素像是在页面间穿越一样。该组件需与 [`page-container`](https://developers.weixin.qq.com/miniprogram/dev/component/page-container.html) 组件结合使用。
+ * 使用时需在当前页放置 `share-element` 组件，同时在 `page-container` 容器中放置对应的 `share-element` 组件，对应关系通过属性值 key 映射。当设置 `page-container` `显示时，transform` 属性为 `true` 的共享元素会产生动画。当前页面容器退出时，会产生返回动画。
+ * @classification viewContainer
+ * @supported weapp
+ * @see https://developers.weixin.qq.com/miniprogram/dev/component/share-element.html
+ */
+declare const ShareElement: ComponentType<ShareElementProps>
+
+export { ShareElement, ShareElementProps }
diff --git a/packages/taro-components/types/VoipRoom.d.ts b/packages/taro-components/types/VoipRoom.d.ts
new file mode 100644
index 000000000000..f11299b76a15
--- /dev/null
+++ b/packages/taro-components/types/VoipRoom.d.ts
@@ -0,0 +1,71 @@
+import { ComponentType } from 'react'
+import { StandardProps } from './common'
+import { StyleProp, ViewStyle } from 'react-native'
+
+interface VoipRoomProps extends StandardProps {
+  /** 进入房间用户的 openid
+   * @default none
+   * @supported weapp, swan, alipay, tt, h5
+   */
+  openId?: string
+
+  /** 对话窗口类型，自身传入 camera，其它用户传入 video
+   * @default camera
+   * @supported weapp, swan, alipay, tt, h5
+   */
+  mode?: keyof VoipRoomProps.mode
+
+  /** 仅在 mode 为 camera 时有效，前置或后置，值为front, back
+   * @default front
+   * @supported weapp, swan, alipay, tt, h5
+   */
+  devicePosition?: keyof VoipRoomProps.devicePosition
+
+  /** 创建对话窗口失败时触发
+   * @supported weapp
+   */
+  onError?: CommonEventFunction
+}
+
+namespace VoipRoomProps {
+  /** 对话窗口类型 */
+  interface mode {
+    camera
+    video
+  }
+
+  /** 摄像头类型 */
+  interface devicePosition {
+    front
+    back
+  }
+}
+
+/** 多人音视频对话
+ *
+ * 需用户授权 `scope.camera`、`scope.record`。相关接口： [Taro.joinVoIPChat](https://developers.weixin.qq.com/miniprogram/dev/api/media/voip/wx.joinVoIPChat.html)
+ * 开通该组件权限后，开发者可在 joinVoIPChat 成功后，获取房间成员的 openid，传递给 voip-room 组件，以显示成员画面。
+ * @classification media
+ * @supported weapp
+ * @example
+ * ```tsx
+ * export default class PageView extends Component {
+ *   constructor() {
+ *     super(...arguments)
+ *   }
+ *
+ *   render() {
+ *     return (
+ *       <VoipRoom
+ *         openId="{{item}}"
+ *         mode="{{selfOpenId === item ? 'camera' : 'video'}}">
+ *       </VoipRoom>
+ *     )
+ *   }
+ * }
+ * ```
+ * @see https://developers.weixin.qq.com/miniprogram/dev/component/voip-room.html
+ */
+declare const VoipRoom: ComponentType<VoipRoomProps>
+
+export { VoipRoom, VoipRoomProps }
diff --git a/packages/taro-components/types/index.d.ts b/packages/taro-components/types/index.d.ts
index a6341b89835f..271fceeb2f86 100644
--- a/packages/taro-components/types/index.d.ts
+++ b/packages/taro-components/types/index.d.ts
@@ -1,49 +1,75 @@
-export { ScrollView } from './ScrollView'
-export { View } from './View'
+export * from './common'
+export * from './event'
+
+/** 视图容器 */
 export { Block } from './Block'
-export { Swiper } from './Swiper'
-export { SwiperItem } from './SwiperItem'
-export { MatchMedia } from './MatchMedia'
-export { MovableView } from './MovableView'
-export { MovableArea } from './MovableArea'
-export { CoverView } from './CoverView'
-export { CoverImage } from './CoverImage'
-export { Icon } from './Icon'
-export { Text } from './Text'
-export { RichText } from './RichText'
-export { Progress } from './Progress'
+export { CoverImage, CoverImageProps } from './CoverImage'
+export { CoverView, CoverViewProps } from './CoverView'
+export { MatchMedia, MatchMediaProps } from './MatchMedia'
+export { MovableArea, MovableAreaProps } from './MovableArea'
+export { MovableView, MovableViewProps } from './MovableView'
+export { PageContainer, PageContainerProps } from './PageContainer'
+export { ScrollView, ScrollViewProps } from './ScrollView'
+export { ShareElement, ShareElementProps } from './ShareElement'
+export { Swiper, SwiperProps } from './Swiper'
+export { SwiperItem, SwiperItemProps } from './SwiperItem'
+export { View, ViewProps } from './View'
+
+/** 基础内容 */
+export { Icon, IconProps } from './Icon'
+export { Progress, ProgressProps } from './Progress'
+export { RichText, RichTextProps } from './RichText'
+export { Text, TextProps } from './Text'
+
+/** 表单组件 */
 export { Button, ButtonProps } from './Button'
-export { Checkbox } from './Checkbox'
-export { CheckboxGroup } from './CheckboxGroup'
-export { Editor } from './Editor'
-export { Form } from './Form'
-export { Input } from './Input'
-export { Label } from './Label'
-export { Picker } from './Picker'
-export { PickerView } from './PickerView'
+export { Checkbox, CheckboxProps } from './Checkbox'
+export { CheckboxGroup, CheckboxGroupProps } from './CheckboxGroup'
+export { Editor, EditorProps } from './Editor'
+export { Form, FormProps } from './Form'
+export { Input, InputProps } from './Input'
+export { KeyboardAccessory, KeyboardAccessoryProps } from './KeyboardAccessory'
+export { Label, LabelProps } from './Label'
+export { Picker, PickerDateProps, PickerTimeProps, PickerRegionProps, PickerSelectorProps, PickerStandardProps, PickerMultiSelectorProps } from './Picker'
+export { PickerView, PickerViewProps } from './PickerView'
 export { PickerViewColumn } from './PickerViewColumn'
-export { Radio } from './Radio'
-export { RadioGroup } from './RadioGroup'
-export { Slider } from './Slider'
-export { Switch } from './Switch'
-export { Textarea } from './Textarea'
-export { Image } from './Image'
-export { Navigator } from './Navigator'
-export { Camera } from './Camera'
-export { Canvas } from './Canvas'
-export { OpenData } from './OpenData'
-export { Video } from './Video'
-export { Ad } from './Ad'
-export { Audio } from './Audio'
-export { FunctionalPageNavigator } from './FunctionalPageNavigator'
-export { LivePlayer } from './LivePlayer'
-export { LivePusher } from './LivePusher'
-export { Map } from './Map'
-export { WebView } from './WebView'
-export { OfficialAccount } from './OfficialAccount'
-export { NavigationBar } from './NavigationBar'
-export { PageMeta } from './PageMeta'
-export { Slot } from './Slot'
-export { CustomWrapper } from './CustomWrapper'
-export * from './common'
-export * from './event'
+export { Radio, RadioProps } from './Radio'
+export { RadioGroup, RadioGroupProps } from './RadioGroup'
+export { Slider, SliderProps } from './Slider'
+export { Switch, SwitchProps } from './Switch'
+export { Textarea, TextareaProps } from './Textarea'
+
+/** 导航 */
+export { FunctionalPageNavigator, FunctionalPageNavigatorProps } from './FunctionalPageNavigator'
+export { Navigator, NavigatorProps } from './Navigator'
+export { NavigationBar, NavigationBarProps } from './NavigationBar'
+// export { Tabbar, TabbarProps } from './Tabbar'
+// export { TabbarItem, TabbarProps } from './TabbarItem'
+
+/** 媒体组件 */
+export { Audio, AudioProps } from './Audio'
+export { Camera, CameraProps } from './Camera'
+export { Image, ImageProps } from './Image'
+export { LivePlayer, LivePlayerProps } from './LivePlayer'
+export { LivePusher, LivePusherProps } from './LivePusher'
+export { Video, VideoProps } from './Video'
+export { VoipRoom, VoipRoomProps } from './VoipRoom'
+
+/** 地图 */
+export { Map, MapProps } from './Map'
+
+/** 画布 */
+export { Canvas, CanvasProps } from './Canvas'
+
+/** 开放能力 */
+export { Ad, AdProps } from './Ad'
+export { AdCustom, AdCustomProps } from './AdCustom'
+export { OfficialAccount, OfficialAccountProps } from './OfficialAccount'
+export { OpenData, OpenDataProps } from './OpenData'
+export { WebView, WebViewProps } from './WebView'
+
+/** 配置节点 */
+export { PageMeta, PageMetaProps } from './PageMeta'
+
+export { CustomWrapper, CustomWrapperProps } from './CustomWrapper'
+export { Slot, SlotProps } from './Slot'