build: update compiler

fix #1591

build/compiler.js

@@ -1,25 +1,22 @@
 const gulp = require('gulp');
 const path = require('path');
 const less = require('gulp-less');
-const ts = require('gulp-typescript');
 const insert = require('gulp-insert');
 const rename = require('gulp-rename');
 const postcss = require('gulp-postcss');
+const util = require('util');
+const exec = util.promisify(require('child_process').exec);
 
-const tsConfig = path.resolve(__dirname, '../tsconfig.json');
-const isProduction = process.env.NODE_ENV === 'production';
 const src = path.join(__dirname, '../packages');
+
+const libConfig = path.resolve(__dirname, '../tsconfig.lib.json');
+const esConfig = path.resolve(__dirname, '../tsconfig.json');
+const exampleConfig = path.resolve(__dirname, '../tsconfig.example.json');
+
 const libDir = path.resolve(__dirname, '../lib');
 const esDir = path.resolve(__dirname, '../dist');
 const exampleDir = path.resolve(__dirname, '../example/dist');
 
-const libConfig = {
-  target: 'es5',
-  lib: ['es2015', 'es2017', 'dom'],
-  module: 'commonjs',
-  declaration: false
-};
-
 const compileLess = dist => () =>
   gulp
     .src(`${src}/**/*.less`)
@@ -28,7 +25,7 @@ const compileLess = dist => () =>
     .pipe(
       insert.transform((contents, file) => {
         if (!file.path.includes('packages' + path.sep + 'common')) {
-          contents = `@import '../common/index.wxss';` + contents;
+          contents = `@import '../common/index.wxss';${contents}`;
         }
         return contents;
       })
@@ -40,35 +37,49 @@ const compileLess = dist => () =>
     )
     .pipe(gulp.dest(dist));
 
-const compileTs = (dist, config) => () => {
+const compileTs = (config, dest) => async () => {
-  const tsProject = ts.createProject(tsConfig, config);
+  await exec(`npx tsc -p ${config}`);
-  return tsProject
+  await exec(`npx tscpaths -p ${config} -s ../packages -o ../${dest}`);
-    .src()
-    .pipe(tsProject())
-    .on('error', () => {})
-    .pipe(gulp.dest(dist));
 };
 
 const copy = (dist, ext) => () =>
   gulp.src(`${src}/**/*.${ext}`).pipe(gulp.dest(dist));
 
-const compile = (dist, config) =>
+const copyStatic = dist =>
+  gulp.parallel(copy(dist, 'wxml'), copy(dist, 'wxs'), copy(dist, 'json'));
+
+const clean = path => () => exec(`npx rimraf ${path}`);
+
+module.exports = {
+  buildEs: gulp.series(
+    clean(esDir),
     gulp.parallel(
-    compileTs(dist, config),
+      compileTs(esConfig, esDir),
-    compileLess(dist),
+      compileLess(esDir),
-    copy(dist, 'wxml'),
+      copyStatic(esDir)
-    copy(dist, 'wxs'),
+    )
-    copy(dist, 'json')
+  ),
-  );
+  buildLib: gulp.series(
-
+    clean(libDir),
-if (isProduction) {
+    gulp.parallel(
-  gulp.series(compile(esDir), compile(libDir, libConfig))();
+      compileTs(libConfig, libDir),
-} else {
+      compileLess(libDir),
-  compile(exampleDir)();
+      copyStatic(libDir)
-
+    )
-  gulp.watch(`${src}/**/*.ts`, compileTs(exampleDir));
+  ),
+  buildExample: gulp.series(
+    clean(exampleDir),
+    gulp.parallel(
+      compileTs(exampleConfig, exampleDir),
+      compileLess(exampleDir),
+      copyStatic(exampleDir),
+      () => {
+        gulp.watch(`${src}/**/*.ts`, compileTs(exampleConfig, exampleDir));
         gulp.watch(`${src}/**/*.less`, compileLess(exampleDir));
         gulp.watch(`${src}/**/*.wxml`, copy(exampleDir, 'wxml'));
         gulp.watch(`${src}/**/*.wxs`, copy(exampleDir, 'wxs'));
         gulp.watch(`${src}/**/*.json`, copy(exampleDir, 'json'));
       }
+    )
+  )
+};

build/dev.js

@@ -1,12 +1,15 @@
-require('./compiler');
 const fs = require('fs-extra');
 const path = require('path');
 const serve = require('webpack-serve');
 const config = require('./webpack.doc.dev');
 const dist = path.join(__dirname, '../example/dist');
 const icons = path.join(__dirname, '../node_modules/@vant/icons');
+const { exec } = require('child_process');
+
+const gulpConfig = path.resolve(__dirname, './compiler.js');
 
-fs.removeSync(dist);
 fs.copySync(icons, path.join(dist, '/@vant/icons'));
 
 serve({}, { config });
+
+exec(`npx gulp -f ${gulpConfig} buildExample`);

dist/common/component.d.ts

@@ -1,2 +1,3 @@
-declare function VantComponent<Data, Props, Watch, Methods, Computed>(vantOptions?: VantComponentOptions<Data, Props, Watch, Methods, Computed, CombinedComponentInstance<Data, Props, Watch, Methods, Computed>>): void;
+import { VantComponentOptions, CombinedComponentInstance } from 'definitions/index';
+declare function VantComponent<Data, Props, Methods, Computed>(vantOptions?: VantComponentOptions<Data, Props, Methods, Computed, CombinedComponentInstance<Data, Props, Methods, Computed>>): void;
 export { VantComponent };

dist/definitions/index.d.ts

@@ -0,0 +1,32 @@
+/// <reference types="miniprogram-api-typings" />
+import { Weapp } from './weapp';
+declare type RecordToAny<T> = {
+    [K in keyof T]: any;
+};
+declare type RecordToReturn<T> = {
+    [P in keyof T]: T[P] extends (...args: any[]) => any ? ReturnType<T[P]> : T[P];
+};
+export declare type CombinedComponentInstance<Data, Props, Methods, Computed> = Methods & WechatMiniprogram.Component.TrivialInstance & Weapp.FormField & {
+    data: Data & RecordToReturn<Computed> & RecordToAny<Props>;
+};
+export interface VantComponentOptions<Data, Props, Methods, Computed, Instance> {
+    data?: Data;
+    field?: boolean;
+    classes?: string[];
+    mixins?: string[];
+    props?: Props & Weapp.PropertyOption;
+    watch?: Weapp.WatchOption<Instance>;
+    computed?: Computed & Weapp.ComputedOption<Instance>;
+    relation?: Weapp.RelationOption<Instance> & {
+        name: string;
+    };
+    relations?: {
+        [componentName: string]: Weapp.RelationOption<Instance>;
+    };
+    methods?: Methods & Weapp.MethodOption<Instance>;
+    beforeCreate?: (this: Instance) => void;
+    created?: (this: Instance) => void;
+    mounted?: (this: Instance) => void;
+    destroyed?: (this: Instance) => void;
+}
+export {};

dist/definitions/weapp.d.ts

@@ -0,0 +1,111 @@
+/// <reference types="miniprogram-api-typings" />
+export declare namespace Weapp {
+    interface FormField {
+        data: {
+            name: string;
+            value: any;
+        };
+    }
+    interface Target {
+        id: string;
+        tagName: string;
+        dataset: {
+            [key: string]: any;
+        };
+    }
+    interface Event {
+        /**
+         * 代表事件的类型。
+         */
+        type: string;
+        /**
+         * 页面打开到触发事件所经过的毫秒数。
+         */
+        timeStamp: number;
+        /**
+         * 触发事件的源组件。
+         */
+        target: Target;
+        /**
+         * 事件绑定的当前组件。
+         */
+        currentTarget: Target;
+        /**
+         * 额外的信息
+         */
+        detail: any;
+    }
+    interface Touch {
+        /**
+         * 触摸点的标识符
+         */
+        identifier: number;
+        /**
+         * 距离文档左上角的距离，文档的左上角为原点 ，横向为X轴，纵向为Y轴
+         */
+        pageX: number;
+        /**
+         * 距离文档左上角的距离，文档的左上角为原点 ，横向为X轴，纵向为Y轴
+         */
+        pageY: number;
+        /**
+         * 距离页面可显示区域（屏幕除去导航条）左上角距离，横向为X轴，纵向为Y轴
+         */
+        clientX: number;
+        /**
+         * 距离页面可显示区域（屏幕除去导航条）左上角距离，横向为X轴，纵向为Y轴
+         */
+        clientY: number;
+    }
+    interface TouchEvent extends Event {
+        touches: Array<Touch>;
+        changedTouches: Array<Touch>;
+    }
+    /**
+     * relation定义，miniprogram-api-typings缺少this定义
+     */
+    interface RelationOption<Instance> {
+        /** 目标组件的相对关系 */
+        type: 'parent' | 'child' | 'ancestor' | 'descendant';
+        /** 关系生命周期函数，当关系被建立在页面节点树中时触发，触发时机在组件attached生命周期之后 */
+        linked?(this: Instance, target: WechatMiniprogram.Component.TrivialInstance): void;
+        /** 关系生命周期函数，当关系在页面节点树中发生改变时触发，触发时机在组件moved生命周期之后 */
+        linkChanged?(this: Instance, target: WechatMiniprogram.Component.TrivialInstance): void;
+        /** 关系生命周期函数，当关系脱离页面节点树时触发，触发时机在组件detached生命周期之后 */
+        unlinked?(this: Instance, target: WechatMiniprogram.Component.TrivialInstance): void;
+        /** 如果这一项被设置，则它表示关联的目标节点所应具有的behavior，所有拥有这一behavior的组件节点都会被关联 */
+        target?: string;
+    }
+    /**
+     * obverser定义，miniprogram-api-typings缺少this定义
+     */
+    type Observer<Instance, T> = (this: Instance, newVal: T, oldVal: T, changedPath: Array<string | number>) => void;
+    /**
+     * watch定义
+     */
+    interface WatchOption<Instance> {
+        [name: string]: string | Observer<Instance, any>;
+    }
+    /**
+     * methods定义，miniprogram-api-typings缺少this定义
+     */
+    interface MethodOption<Instance> {
+        [name: string]: (this: Instance, ...args: any[]) => any;
+    }
+    interface ComputedOption<Instance> {
+        [name: string]: (this: Instance) => any;
+    }
+    type PropertyType = StringConstructor | NumberConstructor | BooleanConstructor | ArrayConstructor | ObjectConstructor | FunctionConstructor | null;
+    interface PropertyOption {
+        [name: string]: PropertyType | PropertyType[] | {
+            /** 属性类型 */
+            type: PropertyType | PropertyType[];
+            /** 属性初始值 */
+            value?: any;
+            /** 属性值被更改时的响应函数 */
+            observer?: string | Observer<WechatMiniprogram.Component.TrivialInstance, any>;
+            /** 属性的类型（可以指定多个） */
+            optionalTypes?: PropertyType[];
+        };
+    }
+}

dist/dialog/dialog.d.ts

@@ -1,10 +1,11 @@
+/// <reference types="miniprogram-api-typings" />
 declare type DialogAction = 'confirm' | 'cancel';
 declare type DialogOptions = {
     lang?: string;
     show?: boolean;
     title?: string;
     zIndex?: number;
-    context?: any;
+    context?: WechatMiniprogram.Page.TrivialInstance | WechatMiniprogram.Component.TrivialInstance;
     message?: string;
     overlay?: boolean;
     selector?: string;

dist/mixins/basic.d.ts

@@ -1 +1 @@
-export declare const basic: void;
+export declare const basic: string;

dist/mixins/button.d.ts

@@ -1 +1 @@
-export declare const button: void;
+export declare const button: string;

dist/mixins/link.d.ts

@@ -1 +1 @@
-export declare const link: void;
+export declare const link: string;

dist/mixins/observer/behavior.d.ts

@@ -1 +1 @@
-export declare const behavior: void;
+export declare const behavior: string;

dist/mixins/open-type.d.ts

@@ -1 +1 @@
-export declare const openType: void;
+export declare const openType: string;

dist/mixins/safe-area.d.ts

@@ -1,4 +1,4 @@
 export declare const safeArea: ({ safeAreaInsetBottom, safeAreaInsetTop }?: {
     safeAreaInsetBottom?: boolean;
     safeAreaInsetTop?: boolean;
-}) => void;
+}) => string;

dist/mixins/touch.d.ts

@@ -1 +1 @@
-export declare const touch: void;
+export declare const touch: string;

dist/mixins/transition.d.ts

@@ -1 +1 @@
-export declare const transition: (showDefaultValue: boolean) => void;
+export declare const transition: (showDefaultValue: boolean) => any;

dist/mixins/transition.js

@@ -10,11 +10,13 @@ export const transition = function (showDefaultValue) {
     return Behavior({
         properties: {
             customStyle: String,
+            // @ts-ignore
             show: {
                 type: Boolean,
                 value: showDefaultValue,
                 observer: 'observeShow'
             },
+            // @ts-ignore
             duration: {
                 type: [Number, Object],
                 value: 300,

dist/tabs/index.js

@@ -95,6 +95,7 @@ VantComponent({
         });
     },
     destroyed() {
+        // @ts-ignore
         this.createIntersectionObserver().disconnect();
     },
     methods: {
@@ -271,7 +272,9 @@ VantComponent({
             }
             const { offsetTop } = this.data;
             const { windowHeight } = wx.getSystemInfoSync();
+            // @ts-ignore
             this.createIntersectionObserver().disconnect();
+            // @ts-ignore
             this.createIntersectionObserver()
                 .relativeToViewport({ top: -(this.navHeight + offsetTop) })
                 .observe('.van-tabs', (res) => {
@@ -286,6 +289,7 @@ VantComponent({
                 });
                 this.setPosition(position);
             });
+            // @ts-ignore
             this.createIntersectionObserver()
                 .relativeToViewport({ bottom: -(windowHeight - 1 - offsetTop) })
                 .observe('.van-tabs', (res) => {

dist/toast/toast.d.ts

@@ -1,10 +1,11 @@
+/// <reference types="miniprogram-api-typings" />
 declare type ToastMessage = string | number;
 interface ToastOptions {
     show?: boolean;
     type?: string;
     mask?: boolean;
     zIndex?: number;
-    context?: any;
+    context?: WechatMiniprogram.Component.TrivialInstance | WechatMiniprogram.Page.TrivialInstance;
     position?: string;
     duration?: number;
     selector?: string;
@@ -13,11 +14,11 @@ interface ToastOptions {
     message?: ToastMessage;
     onClose?: () => void;
 }
-declare function Toast(toastOptions: ToastOptions | ToastMessage): Weapp.Component;
+declare function Toast(toastOptions: ToastOptions | ToastMessage): WechatMiniprogram.Component.TrivialInstance;
 declare namespace Toast {
-    var loading: (options: string | number | ToastOptions) => Weapp.Component;
+    var loading: (options: string | number | ToastOptions) => WechatMiniprogram.Component.Instance<Record<string, any>, Record<string, any>, Record<string, any>>;
-    var success: (options: string | number | ToastOptions) => Weapp.Component;
+    var success: (options: string | number | ToastOptions) => WechatMiniprogram.Component.Instance<Record<string, any>, Record<string, any>, Record<string, any>>;
-    var fail: (options: string | number | ToastOptions) => Weapp.Component;
+    var fail: (options: string | number | ToastOptions) => WechatMiniprogram.Component.Instance<Record<string, any>, Record<string, any>, Record<string, any>>;
     var clear: () => void;
     var setDefaultOptions: (options: ToastOptions) => void;
     var resetDefaultOptions: () => void;

dist/toast/toast.js

@@ -47,7 +47,7 @@ function Toast(toastOptions) {
     }
     return toast;
 }
-const createMethod = type => (options) => Toast(Object.assign({ type }, parseOptions(options)));
+const createMethod = (type) => (options) => Toast(Object.assign({ type }, parseOptions(options)));
 Toast.loading = createMethod('loading');
 Toast.success = createMethod('success');
 Toast.fail = createMethod('fail');

lib/definitions/index.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

lib/definitions/weapp.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

lib/mixins/transition.js

@@ -12,11 +12,13 @@ exports.transition = function (showDefaultValue) {
     return Behavior({
         properties: {
             customStyle: String,
+            // @ts-ignore
             show: {
                 type: Boolean,
                 value: showDefaultValue,
                 observer: 'observeShow'
             },
+            // @ts-ignore
             duration: {
                 type: [Number, Object],
                 value: 300,

lib/tabs/index.js

@@ -98,6 +98,7 @@ component_1.VantComponent({
         });
     },
     destroyed: function () {
+        // @ts-ignore
         this.createIntersectionObserver().disconnect();
     },
     methods: {
@@ -261,7 +262,9 @@ component_1.VantComponent({
             }
             var offsetTop = this.data.offsetTop;
             var windowHeight = wx.getSystemInfoSync().windowHeight;
+            // @ts-ignore
             this.createIntersectionObserver().disconnect();
+            // @ts-ignore
             this.createIntersectionObserver()
                 .relativeToViewport({ top: -(this.navHeight + offsetTop) })
                 .observe('.van-tabs', function (res) {
@@ -276,6 +279,7 @@ component_1.VantComponent({
                 });
                 _this.setPosition(position);
             });
+            // @ts-ignore
             this.createIntersectionObserver()
                 .relativeToViewport({ bottom: -(windowHeight - 1 - offsetTop) })
                 .observe('.van-tabs', function (res) {

package.json

@@ -10,7 +10,7 @@
     "lint": "eslint ./packages --ext .js,.ts",
     "release": "sh build/release.sh",
     "release:site": "sh build/release-site.sh",
-    "build:lib": "yarn && rm -rf dist && rm -rf lib && NODE_ENV=production node build/compiler.js",
+    "build:lib": "yarn && npx gulp -f build/compiler.js --series buildEs buildLib",
     "build:changelog": "vant-doc changelog --tag v0.5.0 ./docs/markdown/changelog.generated.md"
   },
   "files": [
@@ -42,11 +42,10 @@
     "gulp-less": "^4.0.1",
     "gulp-postcss": "^8.0.0",
     "gulp-rename": "^1.2.2",
-    "gulp-typescript": "^5.0.0",
     "html-webpack-plugin": "^3.2.0",
     "less": "^3.9.0",
     "less-loader": "^5.0.0",
-    "miniprogram-api-typings": "2.4.2-2",
+    "miniprogram-api-typings": "2.7.7-2",
     "postcss-loader": "^3.0.0",
     "progress-bar-webpack-plugin": "^1.11.0",
     "style-loader": "^1.0.0",

packages/action-sheet/index.ts

@@ -1,5 +1,6 @@
 import { VantComponent } from '../common/component';
 import { safeArea } from '../mixins/safe-area';
+import { Weapp } from 'definitions/weapp';
 
 VantComponent({
   mixins: [safeArea()],

packages/area/index.ts

@@ -1,5 +1,6 @@
 import { VantComponent } from '../common/component';
 import { pickerProps } from '../picker/shared';
+import { Weapp } from 'definitions/weapp';
 
 type AreaItem = {
   name: string;

packages/badge-group/index.ts

@@ -4,11 +4,11 @@ VantComponent({
   relation: {
     name: 'badge',
     type: 'descendant',
-    linked(target: Weapp.Component) {
+    linked(target) {
       this.badges.push(target);
       this.setActive(this.data.active);
     },
-    unlinked(target: Weapp.Component) {
+    unlinked(target) {
       this.badges = this.badges.filter(item => item !== target);
       this.setActive(this.data.active);
     }

packages/badge/index.ts

@@ -4,7 +4,7 @@ VantComponent({
   relation: {
     type: 'ancestor',
     name: 'badge-group',
-    linked(target: Weapp.Component) {
+    linked(target) {
       this.parent = target;
     }
   },

packages/cell/index.ts

@@ -1,5 +1,6 @@
 import { link } from '../mixins/link';
 import { VantComponent } from '../common/component';
+import { Weapp } from 'definitions/weapp';
 
 VantComponent({
   classes: [

packages/checkbox-group/index.ts

@@ -6,14 +6,14 @@ VantComponent({
   relation: {
     name: 'checkbox',
     type: 'descendant',
-    linked(target: Weapp.Component) {
+    linked(target) {
       this.children = this.children || [];
       this.children.push(target);
       this.updateChild(target);
     },
-    unlinked(target: Weapp.Component) {
+    unlinked(target) {
       this.children = this.children.filter(
-        (child: Weapp.Component) => child !== target
+        (child: WechatMiniprogram.Component.TrivialInstance) => child !== target
       );
     }
   },
@@ -32,12 +32,12 @@ VantComponent({
 
   methods: {
     updateChildren() {
-      (this.children || []).forEach((child: Weapp.Component) =>
+      (this.children || []).forEach((child: WechatMiniprogram.Component.TrivialInstance) =>
         this.updateChild(child)
       );
     },
 
-    updateChild(child: Weapp.Component) {
+    updateChild(child: WechatMiniprogram.Component.TrivialInstance) {
       const { value, disabled } = this.data;
       child.set({
         value: value.indexOf(child.data.name) !== -1,

packages/checkbox/index.ts

@@ -1,6 +1,6 @@
 import { VantComponent } from '../common/component';
 
-function emit(target: Weapp.Component, value: boolean | any[]) {
+function emit(target: WechatMiniprogram.Component.TrivialInstance, value: boolean | any[]) {
   target.$emit('input', value);
   target.$emit('change', value);
 }
@@ -57,7 +57,7 @@ VantComponent({
       }
     },
 
-    setParentValue(parent: Weapp.Component, value: boolean) {
+    setParentValue(parent: WechatMiniprogram.Component.TrivialInstance, value: boolean) {
       const parentValue = parent.data.value.slice();
       const { name } = this.data;
       const { max } = parent.data;

packages/collapse-item/index.ts

@@ -8,7 +8,7 @@ VantComponent({
   relation: {
     name: 'collapse',
     type: 'ancestor',
-    linked(parent: Weapp.Component) {
+    linked(parent) {
       this.parent = parent;
     }
   },
@@ -81,7 +81,7 @@ VantComponent({
 
     updateStyle(expanded: boolean) {
       return this.getRect('.van-collapse-item__content')
-        .then((rect: wx.BoundingClientRectCallbackResult) => rect.height)
+        .then((rect: WechatMiniprogram.BoundingClientRectCallbackResult) => rect.height)
         .then((height: number) => {
           if (expanded) {
             return this.set({

packages/collapse/index.ts

@@ -4,12 +4,12 @@ VantComponent({
   relation: {
     name: 'collapse-item',
     type: 'descendant',
-    linked(child: Weapp.Component) {
+    linked(child) {
       this.children.push(child);
     },
-    unlinked(child: Weapp.Component) {
+    unlinked(child) {
       this.children = this.children.filter(
-        (item: Weapp.Component) => item !== child
+        (item: WechatMiniprogram.Component.TrivialInstance) => item !== child
       );
     }
   },
@@ -35,7 +35,7 @@ VantComponent({
 
   methods: {
     updateExpanded() {
-      this.children.forEach((child: Weapp.Component) => {
+      this.children.forEach((child: WechatMiniprogram.Component.TrivialInstance) => {
         child.updateExpanded();
       });
     },

packages/common/component.ts

@@ -1,5 +1,7 @@
 import { basic } from '../mixins/basic';
 import { observe } from '../mixins/observer/index';
+import { VantComponentOptions, CombinedComponentInstance } from 'definitions/index';
+import { Weapp } from 'packages/definitions/weapp';
 
 function mapKeys(source: object, target: object, map: object) {
   Object.keys(map).forEach(key => {
@@ -9,14 +11,13 @@ function mapKeys(source: object, target: object, map: object) {
   });
 }
 
-function VantComponent<Data, Props, Watch, Methods, Computed>(
+function VantComponent<Data, Props, Methods, Computed>(
   vantOptions: VantComponentOptions<
     Data,
     Props,
-    Watch,
     Methods,
     Computed,
-    CombinedComponentInstance<Data, Props, Watch, Methods, Computed>
+    CombinedComponentInstance<Data, Props, Methods, Computed>
   > = {}
 ): void {
   const options: any = {};

packages/definitions/index.ts

@@ -0,0 +1,39 @@
+import { Weapp } from './weapp';
+
+type RecordToAny<T> = { [K in keyof T]: any };
+type RecordToReturn<T> = {
+  [P in keyof T]: T[P] extends (...args: any[]) => any ? ReturnType<T[P]> : T[P]
+};
+
+export type CombinedComponentInstance<
+  Data,
+  Props,
+  Methods,
+  Computed
+> = Methods &
+  WechatMiniprogram.Component.TrivialInstance &
+  Weapp.FormField &
+  {
+    data: Data & RecordToReturn<Computed> & RecordToAny<Props>;
+  };
+
+export interface VantComponentOptions<Data, Props, Methods, Computed, Instance> {
+  data?: Data;
+  field?: boolean;
+  classes?: string[];
+  mixins?: string[];
+  props?: Props & Weapp.PropertyOption;
+  watch?: Weapp.WatchOption<Instance>;
+  computed?: Computed & Weapp.ComputedOption<Instance>;
+  relation?: Weapp.RelationOption<Instance> & { name: string };
+  relations?: {
+    [componentName: string]: Weapp.RelationOption<Instance>;
+  };
+  methods?: Methods & Weapp.MethodOption<Instance>;
+
+  // lifetimes
+  beforeCreate?: (this: Instance) => void;
+  created?: (this: Instance) => void;
+  mounted?: (this: Instance) => void;
+  destroyed?: (this: Instance) => void;
+}

packages/definitions/weapp.ts

@@ -0,0 +1,133 @@
+export namespace Weapp {
+  export interface FormField {
+    data: {
+      name: string
+      value: any
+    }
+  }
+
+  interface Target {
+    id: string
+    tagName: string
+    dataset: {
+      [key: string]: any
+    }
+  }
+
+  export interface Event {
+    /**
+     * 代表事件的类型。
+     */
+    type: string
+    /**
+     * 页面打开到触发事件所经过的毫秒数。
+     */
+    timeStamp: number
+    /**
+     * 触发事件的源组件。
+     */
+    target: Target
+    /**
+     * 事件绑定的当前组件。
+     */
+    currentTarget: Target
+    /**
+     * 额外的信息
+     */
+    detail: any
+  }
+
+  interface Touch {
+    /**
+     * 触摸点的标识符
+     */
+    identifier: number
+    /**
+     * 距离文档左上角的距离，文档的左上角为原点 ，横向为X轴，纵向为Y轴
+     */
+    pageX: number
+    /**
+     * 距离文档左上角的距离，文档的左上角为原点 ，横向为X轴，纵向为Y轴
+     */
+    pageY: number
+    /**
+     * 距离页面可显示区域（屏幕除去导航条）左上角距离，横向为X轴，纵向为Y轴
+     */
+    clientX: number
+    /**
+     * 距离页面可显示区域（屏幕除去导航条）左上角距离，横向为X轴，纵向为Y轴
+     */
+    clientY: number
+  }
+
+  export interface TouchEvent extends Event {
+    touches: Array<Touch>
+    changedTouches: Array<Touch>
+  }
+
+  /**
+   * relation定义，miniprogram-api-typings缺少this定义
+   */
+  export interface RelationOption<Instance> {
+    /** 目标组件的相对关系 */
+    type: 'parent' | 'child' | 'ancestor' | 'descendant';
+    /** 关系生命周期函数，当关系被建立在页面节点树中时触发，触发时机在组件attached生命周期之后 */
+    linked?(this: Instance, target: WechatMiniprogram.Component.TrivialInstance): void;
+    /** 关系生命周期函数，当关系在页面节点树中发生改变时触发，触发时机在组件moved生命周期之后 */
+    linkChanged?(this: Instance, target: WechatMiniprogram.Component.TrivialInstance): void;
+    /** 关系生命周期函数，当关系脱离页面节点树时触发，触发时机在组件detached生命周期之后 */
+    unlinked?(this: Instance, target: WechatMiniprogram.Component.TrivialInstance): void;
+    /** 如果这一项被设置，则它表示关联的目标节点所应具有的behavior，所有拥有这一behavior的组件节点都会被关联 */
+    target?: string;
+  }
+
+  /**
+   * obverser定义，miniprogram-api-typings缺少this定义
+   */
+  type Observer<Instance, T> = (
+    this: Instance,
+    newVal: T,
+    oldVal: T,
+    changedPath: Array<string | number>,
+  ) => void;
+
+  /**
+   * watch定义
+   */
+  export interface WatchOption<Instance> {
+    [name: string]: string | Observer<Instance, any>
+  }
+
+  /**
+   * methods定义，miniprogram-api-typings缺少this定义
+   */
+  export interface MethodOption<Instance> {
+    [name: string]: (this: Instance, ...args: any[]) => any
+  }
+
+  export interface ComputedOption<Instance> {
+    [name: string]: (this: Instance) => any
+  }
+
+  type PropertyType =
+    | StringConstructor
+    | NumberConstructor
+    | BooleanConstructor
+    | ArrayConstructor
+    | ObjectConstructor
+    | FunctionConstructor
+    | null;
+
+  export interface PropertyOption {
+    [name: string]: PropertyType | PropertyType[] | {
+      /** 属性类型 */
+      type: PropertyType | PropertyType[];
+      /** 属性初始值 */
+      value?: any;
+      /** 属性值被更改时的响应函数 */
+      observer?: string | Observer<WechatMiniprogram.Component.TrivialInstance, any>;
+      /** 属性的类型（可以指定多个） */
+      optionalTypes?: PropertyType[];
+    }
+  }
+}

packages/dialog/dialog.ts

@@ -6,7 +6,7 @@ type DialogOptions = {
   show?: boolean;
   title?: string;
   zIndex?: number;
-  context?: any;
+  context?: WechatMiniprogram.Page.TrivialInstance | WechatMiniprogram.Component.TrivialInstance;
   message?: string;
   overlay?: boolean;
   selector?: string;

packages/field/index.ts

@@ -1,4 +1,5 @@
 import { VantComponent } from '../common/component';
+import { Weapp } from 'definitions/weapp';
 
 VantComponent({
   field: true,

packages/goods-action-button/index.ts

@@ -2,6 +2,7 @@ import { VantComponent } from '../common/component';
 import { link } from '../mixins/link';
 import { button } from '../mixins/button';
 import { openType } from '../mixins/open-type';
+import { Weapp } from 'definitions/weapp';
 
 VantComponent({
   mixins: [link, button, openType],

packages/goods-action-icon/index.ts

@@ -2,6 +2,7 @@ import { VantComponent } from '../common/component';
 import { link } from '../mixins/link';
 import { button } from '../mixins/button';
 import { openType } from '../mixins/open-type';
+import { Weapp } from 'definitions/weapp';
 
 VantComponent({
   classes: ['icon-class', 'text-class'],

packages/mixins/observer/behavior.ts

@@ -1,4 +1,4 @@
-function setAsync(context: Weapp.Component, data: object) {
+function setAsync(context: WechatMiniprogram.Component.TrivialInstance, data: object) {
   return new Promise(resolve => {
     context.setData(data, resolve);
   });

packages/mixins/open-type.ts

@@ -1,3 +1,5 @@
+import { Weapp } from "definitions/weapp";
+
 export const openType = Behavior({
   properties: {
     openType: String

packages/mixins/touch.ts

@@ -1,3 +1,5 @@
+import { Weapp } from "definitions/weapp";
+
 export const touch = Behavior({
   methods: {
     touchStart(event: Weapp.TouchEvent) {

packages/mixins/transition.ts

@@ -13,11 +13,13 @@ export const transition = function (showDefaultValue: boolean) {
   return Behavior({
     properties: {
       customStyle: String,
+      // @ts-ignore
       show: {
         type: Boolean,
         value: showDefaultValue,
         observer: 'observeShow'
       },
+      // @ts-ignore
       duration: {
         type: [Number, Object],
         value: 300,

packages/notice-bar/index.ts

@@ -1,4 +1,5 @@
 import { VantComponent } from '../common/component';
+import { Weapp } from 'definitions/weapp';
 
 const FONT_COLOR = '#ed6a0c';
 const BG_COLOR = '#fffbe8';
@@ -74,7 +75,7 @@ VantComponent({
       Promise.all([
         this.getRect('.van-notice-bar__content'),
         this.getRect('.van-notice-bar__wrap')
-      ]).then((rects: wx.BoundingClientRectCallbackResult[]) => {
+      ]).then((rects: WechatMiniprogram.BoundingClientRectCallbackResult[]) => {
         const [contentRect, wrapRect] = rects;
         if (
           contentRect == null ||

packages/notify/notify.ts

@@ -20,7 +20,7 @@ function parseOptions(text: NotifyOptions | string): NotifyOptions {
   return isObj(text) ? (text as NotifyOptions) : ({ text } as NotifyOptions);
 }
 
-function getContext(): Page.PageInstance {
+function getContext() {
   const pages = getCurrentPages();
   return pages[pages.length - 1];
 }

packages/picker-column/index.ts

@@ -1,5 +1,6 @@
 import { VantComponent } from '../common/component';
 import { isObj, range } from '../common/utils';
+import { Weapp } from 'definitions/weapp';
 
 const DEFAULT_DURATION = 200;
 

packages/picker/index.ts

@@ -1,5 +1,6 @@
 import { VantComponent } from '../common/component';
 import { pickerProps } from './shared';
+import { Weapp } from 'definitions/weapp';
 
 interface Column {
   values: object[];
@@ -147,7 +148,7 @@ VantComponent({
 
     // get values of all columns
     getValues() {
-      return this.children.map((child: Weapp.Component) => child.getValue());
+      return this.children.map((child: WechatMiniprogram.Component.TrivialInstance) => child.getValue());
     },
 
     // set values of all columns
@@ -161,7 +162,7 @@ VantComponent({
     // get indexes of all columns
     getIndexes() {
       return this.children.map(
-        (child: Weapp.Component) => child.data.currentIndex
+        (child: WechatMiniprogram.Component.TrivialInstance) => child.data.currentIndex
       );
     },
 

packages/radio-group/index.ts

@@ -6,14 +6,14 @@ VantComponent({
   relation: {
     name: 'radio',
     type: 'descendant',
-    linked(target: Weapp.Component) {
+    linked(target) {
       this.children = this.children || [];
       this.children.push(target);
       this.updateChild(target);
     },
-    unlinked(target: Weapp.Component) {
+    unlinked(target) {
       this.children = this.children.filter(
-        (child: Weapp.Component) => child !== target
+        (child: WechatMiniprogram.Component.TrivialInstance) => child !== target
       );
     }
   },
@@ -31,12 +31,12 @@ VantComponent({
 
   methods: {
     updateChildren() {
-      (this.children || []).forEach((child: Weapp.Component) =>
+      (this.children || []).forEach((child: WechatMiniprogram.Component.TrivialInstance) =>
         this.updateChild(child)
       );
     },
 
-    updateChild(child: Weapp.Component) {
+    updateChild(child: WechatMiniprogram.Component.TrivialInstance) {
       const { value, disabled } = this.data;
       child.set({
         value,

packages/radio/index.ts

@@ -1,4 +1,5 @@
 import { VantComponent } from '../common/component';
+import { Weapp } from 'definitions/weapp';
 
 VantComponent({
   field: true,
@@ -6,7 +7,7 @@ VantComponent({
   relation: {
     name: 'radio-group',
     type: 'ancestor',
-    linked(target: Weapp.Component) {
+    linked(target) {
       this.parent = target;
     },
     unlinked() {

packages/rate/index.ts

@@ -1,4 +1,5 @@
 import { VantComponent } from '../common/component';
+import { Weapp } from 'definitions/weapp';
 
 VantComponent({
   field: true,
@@ -67,7 +68,7 @@ VantComponent({
       const { clientX, clientY } = event.touches[0];
 
       this.getRect('.van-rate__icon', true).then(
-        (list: wx.BoundingClientRectCallbackResult[]) => {
+        (list: WechatMiniprogram.BoundingClientRectCallbackResult[]) => {
           const target = list
             .sort(item => item.right - item.left)
             .find(

packages/row/index.ts

@@ -4,7 +4,7 @@ VantComponent({
   relation: {
     name: 'col',
     type: 'descendant',
-    linked(target: Weapp.Component) {
+    linked(target) {
       if (this.data.gutter) {
         target.setGutter(this.data.gutter);
       }

packages/search/index.ts

@@ -1,4 +1,5 @@
 import { VantComponent } from '../common/component';
+import { Weapp } from 'definitions/weapp';
 
 VantComponent({
   field: true,

packages/slider/index.ts

@@ -1,5 +1,6 @@
 import { VantComponent } from '../common/component';
 import { touch } from '../mixins/touch';
+import { Weapp } from 'definitions/weapp';
 
 VantComponent({
   mixins: [touch],
@@ -53,7 +54,7 @@ VantComponent({
       if (this.data.disabled) return;
 
       this.touchMove(event);
-      this.getRect('.van-slider').then((rect: wx.BoundingClientRectCallbackResult) => {
+      this.getRect('.van-slider').then((rect: WechatMiniprogram.BoundingClientRectCallbackResult) => {
         const diff = this.deltaX / rect.width * 100;
         this.newValue = this.startValue + diff;
         this.updateValue(this.newValue, false, true);
@@ -68,7 +69,7 @@ VantComponent({
     onClick(event: Weapp.TouchEvent) {
       if (this.data.disabled) return;
 
-      this.getRect('.van-slider').then((rect: wx.BoundingClientRectCallbackResult) => {
+      this.getRect('.van-slider').then((rect: WechatMiniprogram.BoundingClientRectCallbackResult) => {
         const value = (event.detail.x - rect.left) / rect.width * 100;
         this.updateValue(value, true);
       });

packages/stepper/index.ts

@@ -1,4 +1,5 @@
 import { VantComponent } from '../common/component';
+import { Weapp } from 'definitions/weapp';
 
 VantComponent({
   field: true,

packages/submit-bar/index.ts

@@ -1,5 +1,6 @@
 import { VantComponent } from '../common/component';
 import { safeArea } from '../mixins/safe-area';
+import { Weapp } from 'definitions/weapp';
 
 VantComponent({
   mixins: [safeArea()],

packages/swipe-cell/index.ts

@@ -1,5 +1,6 @@
 import { VantComponent } from '../common/component';
 import { touch } from '../mixins/touch';
+import { Weapp } from 'definitions/weapp';
 
 const THRESHOLD = 0.3;
 

packages/switch-cell/index.ts

@@ -1,4 +1,5 @@
 import { VantComponent } from '../common/component';
+import { Weapp } from 'definitions/weapp';
 
 VantComponent({
   field: true,

packages/tabbar/index.ts

@@ -7,14 +7,14 @@ VantComponent({
   relation: {
     name: 'tabbar-item',
     type: 'descendant',
-    linked(target: Weapp.Component) {
+    linked(target) {
       this.children.push(target);
       target.parent = this;
       target.updateFromParent();
     },
-    unlinked(target: Weapp.Component) {
+    unlinked(target) {
       this.children = this.children.filter(
-        (item: Weapp.Component) => item !== target
+        (item: WechatMiniprogram.Component.TrivialInstance) => item !== target
       );
       this.updateChildren();
     }
@@ -59,11 +59,11 @@ VantComponent({
       }
 
       return Promise.all(
-        children.map((child: Weapp.Component) => child.updateFromParent())
+        children.map((child: WechatMiniprogram.Component.TrivialInstance) => child.updateFromParent())
       );
     },
 
-    onChange(child: Weapp.Component) {
+    onChange(child: WechatMiniprogram.Component.TrivialInstance) {
       const index = this.children.indexOf(child);
       const active = child.data.name || index;
 

packages/tabs/index.ts

@@ -1,5 +1,6 @@
 import { VantComponent } from '../common/component';
 import { touch } from '../mixins/touch';
+import { Weapp } from 'definitions/weapp';
 
 type TabItemData = {
   width?: number
@@ -18,11 +19,11 @@ VantComponent({
   relation: {
     name: 'tab',
     type: 'descendant',
-    linked(child: Weapp.Component) {
+    linked(child) {
       this.child.push(child);
       this.updateTabs(this.data.tabs.concat(child.data));
     },
-    unlinked(child: Weapp.Component) {
+    unlinked(child) {
       const index = this.child.indexOf(child);
       const { tabs } = this.data;
       tabs.splice(index, 1);
@@ -108,7 +109,7 @@ VantComponent({
     this.scrollIntoView();
 
     this.getRect('.van-tabs__wrap').then(
-      (rect: wx.BoundingClientRectCallbackResult) => {
+      (rect: WechatMiniprogram.BoundingClientRectCallbackResult) => {
         this.navHeight = rect.height;
         this.observerContentScroll();
       }
@@ -116,6 +117,7 @@ VantComponent({
   },
 
   destroyed() {
+    // @ts-ignore
     this.createIntersectionObserver().disconnect();
   },
 
@@ -162,7 +164,7 @@ VantComponent({
       const { color, active, duration, lineWidth, lineHeight } = this.data;
 
       this.getRect('.van-tab', true).then(
-        (rects: wx.BoundingClientRectCallbackResult[]) => {
+        (rects: WechatMiniprogram.BoundingClientRectCallbackResult[]) => {
           const rect = rects[active];
           const width = lineWidth !== -1 ? lineWidth : rect.width / 2;
           const height = lineHeight !== -1 ? `height: ${lineHeight}px;` : '';
@@ -197,7 +199,7 @@ VantComponent({
       if (!animated) return '';
 
       this.getRect('.van-tabs__content').then(
-        (rect: wx.BoundingClientRectCallbackResult) => {
+        (rect: WechatMiniprogram.BoundingClientRectCallbackResult) => {
           const { width } = rect;
 
           this.set({
@@ -212,7 +214,7 @@ VantComponent({
 
           const props = { width, animated };
 
-          this.child.forEach((item: Weapp.Component) => {
+          this.child.forEach((item: WechatMiniprogram.Component.TrivialInstance) => {
             item.set(props);
           });
         }
@@ -220,7 +222,7 @@ VantComponent({
     },
 
     setActiveTab() {
-      this.child.forEach((item: Weapp.Component, index: number) => {
+      this.child.forEach((item: WechatMiniprogram.Component.TrivialInstance, index: number) => {
         const data: TabItemData = {
           active: index === this.data.active
         };
@@ -254,8 +256,8 @@ VantComponent({
         this.getRect('.van-tabs__nav')
       ]).then(
         ([tabRects, navRect]: [
-        wx.BoundingClientRectCallbackResult[],
+        WechatMiniprogram.BoundingClientRectCallbackResult[],
-        wx.BoundingClientRectCallbackResult
+        WechatMiniprogram.BoundingClientRectCallbackResult
         ]) => {
           const tabRect = tabRects[active];
           const offsetLeft = tabRects
@@ -337,11 +339,13 @@ VantComponent({
       const { offsetTop } = this.data;
       const { windowHeight } = wx.getSystemInfoSync();
 
+      // @ts-ignore
       this.createIntersectionObserver().disconnect();
 
+      // @ts-ignore
       this.createIntersectionObserver()
         .relativeToViewport({ top: -(this.navHeight + offsetTop) })
-        .observe('.van-tabs', (res: wx.ObserveCallbackResult) => {
+        .observe('.van-tabs', (res: WechatMiniprogram.ObserveCallbackResult) => {
           const { top } = res.boundingClientRect;
 
           if (top > offsetTop) {
@@ -359,9 +363,10 @@ VantComponent({
           this.setPosition(position);
         });
 
+      // @ts-ignore
       this.createIntersectionObserver()
         .relativeToViewport({ bottom: -(windowHeight - 1 - offsetTop) })
-        .observe('.van-tabs', (res: wx.ObserveCallbackResult) => {
+        .observe('.van-tabs', (res: WechatMiniprogram.ObserveCallbackResult) => {
           const { top, bottom } = res.boundingClientRect;
 
           if (bottom < this.navHeight) {

packages/toast/toast.ts

@@ -7,7 +7,7 @@ interface ToastOptions {
   type?: string;
   mask?: boolean;
   zIndex?: number;
-  context?: any;
+  context?: WechatMiniprogram.Component.TrivialInstance | WechatMiniprogram.Page.TrivialInstance;
   position?: string;
   duration?: number;
   selector?: string;
@@ -42,7 +42,7 @@ function getContext() {
   return pages[pages.length - 1];
 }
 
-function Toast(toastOptions: ToastOptions | ToastMessage): Weapp.Component {
+function Toast(toastOptions: ToastOptions | ToastMessage): WechatMiniprogram.Component.TrivialInstance {
   const options = {
     ...currentOptions,
     ...parseOptions(toastOptions)
@@ -81,7 +81,7 @@ function Toast(toastOptions: ToastOptions | ToastMessage): Weapp.Component {
   return toast;
 }
 
-const createMethod = type => (options: ToastOptions | ToastMessage) =>
+const createMethod = (type: string) => (options: ToastOptions | ToastMessage) =>
   Toast({
     type,
     ...parseOptions(options)

packages/tree-select/index.ts

@@ -1,4 +1,5 @@
 import { VantComponent } from '../common/component';
+import { Weapp } from 'definitions/weapp';
 
 const ITEM_HEIGHT = 44;
 

tsconfig.example.json

@@ -0,0 +1,6 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "outDir": "example/dist"
+  }
+}

tsconfig.json

@@ -3,11 +3,14 @@
     "module": "es6",
     "esModuleInterop": true,
     "target": "es6",
-    "noImplicitAny": false,
     "declaration": true,
+    "noImplicitAny": false,
     "outDir": "dist",
     "baseUrl": ".",
-    "types": ["miniprogram-api-typings"]
+    "types": ["miniprogram-api-typings"],
-  },
+    "paths": {
-  "include": ["packages/**/*", "types/**/*"]
+      "definitions/*": ["./packages/definitions/*"]
+    }
+  },
+  "include": ["packages/**/*"]
 }

tsconfig.lib.json

@@ -0,0 +1,10 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "module": "commonjs",
+    "target": "es5",
+    "lib": ["es2015", "es2017", "dom"],
+    "declaration": false,
+    "outDir": "lib"
+  }
+}

types/index.d.ts

@@ -1,65 +0,0 @@
-/// <reference path="./weapp.d.ts" />
-
-interface ComponentInstance {
-  triggerEvent: never;
-  $emit(name: string, detail?: any): void;
-}
-
-type Mixins = any[];
-type ExternalClasses = string[];
-type LooseObject = {
-  [key: string]: any;
-};
-type Relation<Instance> = {
-  name?: string;
-  type: string;
-  linked?: (this: Instance, target?: Weapp.Component) => void;
-  unlinked?: (this: Instance, target?: Weapp.Component) => void;
-};
-type Relations<Instance> = {
-  [key: string]: Relation<Instance>;
-};
-type RecordToAny<T> = { [K in keyof T]: any };
-type RecordToReturn<T> = {
-  [P in keyof T]: T[P] extends (...args: any[]) => any ? ReturnType<T[P]> : T[P]
-};
-
-type CombinedComponentInstance<
-  Data,
-  Props,
-  Watch,
-  Methods,
-  Computed
-> = Methods &
-  LooseObject &
-  Weapp.Component &
-  Weapp.FormField &
-  ComponentInstance & {
-    data: Data & LooseObject & RecordToAny<Props> & RecordToReturn<Computed>;
-  };
-
-type VantComponentOptions<
-  Data,
-  Props,
-  Watch,
-  Methods,
-  Computed,
-  Instance
-> = {
-  data?: Data;
-  field?: boolean;
-  mixins?: Mixins;
-  props?: Props & ThisType<Instance>;
-  watch?: Watch & ThisType<Instance>;
-  computed?: Computed & ThisType<Instance>;
-  relation?: Relation<Instance>;
-  relations?: Relations<Instance>;
-  classes?: ExternalClasses;
-  methods?: Methods & ThisType<Instance>;
-
-  // lifetimes
-  beforeCreate?: (this: Instance) => void;
-  created?: (this: Instance) => void;
-  mounted?: (this: Instance) => void;
-  destroyed?: (this: Instance) => void;
-};

types/weapp.d.ts

@@ -1,80 +0,0 @@
-type BehaviorOptions = {
-  [key: string]: any & ThisType<any>
-};
-
-declare function Behavior(options: BehaviorOptions): void
-declare function Component(options: any): void
-
-declare namespace Weapp {
-  interface Component {
-    [key: string]: any
-    getRelationNodes(selector: string): any[]
-    setData(data: any, callback?: Function): void
-  }
-
-  interface FormField {
-    data: {
-      name: string
-      value: any
-    }
-  }
-
-  interface Target {
-    id: string
-    tagName: string
-    dataset: {
-      [key: string]: any
-    }
-  }
-
-  interface Event {
-    /**
-     * 代表事件的类型。
-     */
-    type: string
-    /**
-     * 页面打开到触发事件所经过的毫秒数。
-     */
-    timeStamp: number
-    /**
-     * 触发事件的源组件。
-     */
-    target: Target
-    /**
-     * 事件绑定的当前组件。
-     */
-    currentTarget: Target
-    /**
-     * 	额外的信息
-     */
-    detail: any
-  }
-
-  interface Touch {
-    /**
-     * 触摸点的标识符
-     */
-    identifier: number
-    /**
-     * 距离文档左上角的距离，文档的左上角为原点 ，横向为X轴，纵向为Y轴
-     */
-    pageX: number
-    /**
-     * 距离文档左上角的距离，文档的左上角为原点 ，横向为X轴，纵向为Y轴
-     */
-    pageY: number
-    /**
-     * 距离页面可显示区域（屏幕除去导航条）左上角距离，横向为X轴，纵向为Y轴
-     */
-    clientX: number
-    /**
-     * 距离页面可显示区域（屏幕除去导航条）左上角距离，横向为X轴，纵向为Y轴
-     */
-    clientY: number
-  }
-
-  interface TouchEvent extends Event {
-    touches: Array<Touch>
-    changedTouches: Array<Touch>
-  }
-}