feat(core & build): 小程序 SFC 中支持 Vue.extend() 写法 (#161)

* .vue 中支持 Vue.extend() 写法

* feat: 补充类型定义

packages/mars-build/src/compiler/script/babel-plugin-script.js

@@ -140,7 +140,7 @@ const getPropertyVisitor = (t, options) => {
 
 function transfromSFCExport(t, declarationPath, options) {
     if (!t.isObjectExpression(declarationPath)) {
-        throw declarationPath.buildCodeFrameError('should export plain object in SFC');
+        throw declarationPath.buildCodeFrameError('should export plain object or Vue.extend() in SFC');
     }
 
     declarationPath.traverse(getPropertyVisitor(t, options));
@@ -173,6 +173,13 @@ module.exports = function getVisitor(options = {}) {
             visitor: {
                 ExportDefaultDeclaration(path, state) {
                     declarationPath = path.get('declaration');
+
+                    // 只取 Vue.extend() 的参数部分
+                    if (t.isCallExpression(declarationPath)) {
+                        const objectExpression = declarationPath.get('arguments')[0];
+                        declarationPath.replaceWith(objectExpression);
+                    }
+
                     transfromSFCExport(t, declarationPath, options);
                     exportPath = path;
                     file.moduleType = 'esm';

packages/mars-core/package.json

@@ -3,5 +3,7 @@
     "version": "0.2.18",
     "scripts": {
         "test": "jest --coverage"
-    }
+    },
+    "main": "src/index.js",
+    "typings": "types/index.d.ts"
 }

packages/mars-core/types/index.d.ts

@@ -0,0 +1,25 @@
+export {default as Vue} from './vue/index';
+import Vue from './vue/index';
+import {swanApp, marsApis} from './mars';
+import './swan';
+
+export {swanApp} from './mars';
+
+// 补充 this. 上的属性和方法
+declare module './vue/vue' {
+    interface Vue {
+        $myProperty: string;
+        $mpUpdated: (cb?: Function) => Promise<any>;
+        $api: marsApis
+    }
+}
+
+// 补充 Vue.extend() 参数对象中的 key
+declare module './vue/options' {
+    interface ComponentOptions<V extends Vue> {
+        onLoad?: Function;
+        onReady?: Function;
+        onHide?: Function;
+        config?: any
+    }
+}

packages/mars-core/types/mars.d.ts

@@ -0,0 +1,33 @@
+declare global {
+    const getApp: () => app;
+    const getCurrentPages: () => any[];
+}
+
+export interface swanApp {
+    $api: marsApis;
+}
+
+export interface marsApis {
+    navigateToSmartProgram: (options: swan.swanApiOptionsNavigateToSmartProgram) => Promise<void>;
+    getStorage: (options: swan.swanApiOptionsGetStorage) => Promise<any>;
+    setStorage: (options: any) => Promise<any>;
+    getBackgroundAudioManager: () => Promise<swan.backgroundAudioManager>;
+    request: (options: any) => Promise<any>;
+    login: (options?: any) => Promise<any>;
+    showModal: (options?: any) => Promise<any>;
+    uploadFile: (options?: any) => Promise<any>;
+    isLoginSync: (options?: any) => {isLogin: boolean};
+
+    redirectTo: (options?: any) => Promise<any>;
+    navigateTo: (options?: any) => Promise<any>;
+    navigateBack: (options?: any) => Promise<any>;
+
+    chooseImage: (options?: any) => Promise<any>;
+
+    createSelectorQuery: () => {
+        select: (options?: any) => {
+            boundingClientRect: () => void;
+        },
+        exec: (options?: any) => void;
+    };
+}

packages/mars-core/types/swan.d.ts

@@ -0,0 +1,93 @@
+declare namespace swan {
+    const setPageInfo: (options: swanApiOptionsSetPageInfo) => void;
+    const showLoading: (options: swanApiOptionsShowLoading) => void;
+    const hideLoading: () => void;
+    const showToast: (options: swanApiOptionsShowToast) => void;
+    const getSystemInfo: (options: swanApiOptionsGetSystemInfo) => void;
+    const showFavoriteGuide: () => void;
+    const navigateToSmartProgram: (options: swanApiOptionsNavigateToSmartProgram) => void;
+    const getStorage: (options: swanApiOptionsGetStorage) => void;
+
+    interface swanApiOptionsBase {
+        success?: (res: any) => any;
+        fail?: () => {};
+        complete?: () => {};
+    }
+
+    interface swanApiOptionsSetPageInfo extends swanApiOptionsBase {
+        title: string;
+        keywords: string;
+        description: string;
+        releaseDate?: string;
+        articleTitle?: string;
+        image?: string | string[];
+        video?: any;
+        visit?: any;
+        likes?: string;
+        comments?: string;
+        collects?: string;
+        shares?: string;
+        followers?: string;
+    }
+
+    interface swanApiOptionsShowLoading extends swanApiOptionsBase {
+        title: string;
+        mask?: boolean;
+    }
+
+    interface swanApiOptionsShowToast extends swanApiOptionsBase {
+        title: string;
+        icon?: string;
+        image?: string;
+        duration?: number;
+        mask?: boolean;
+    }
+
+    type swanApiOptionsGetSystemInfo = {
+        success: (res: systemInfo) => void;
+        fail?: () => {};
+        complete?: () => {};
+    }
+
+    interface swanApiOptionsNavigateToSmartProgram extends swanApiOptionsBase {
+        appKey: string;
+        path: string;
+        extraData: {
+            [key: string]: any
+        }
+    }
+    interface swanApiOptionsGetStorage extends swanApiOptionsBase {
+        key: string;
+    }
+
+    interface systemInfo {
+        brand: string;
+        model: string;
+        pixelRatio: string;
+        screenWidth: string;
+        screenHeight: string;
+        windowWidth: string;
+        windowHeight: string;
+        statusBarHeight: string;
+        navigationBarHeight: string;
+        language: string;
+        version: string;
+        system: string;
+        platform: string;
+        fontSizeSetting: string;
+        SDKVersion: string;
+        host: string;
+        cacheLocation: string;
+        swanNativeVersion: string;
+        devicePixelRatio: string
+    }
+
+    interface backgroundAudioManager {
+        onEnded: (res: any) => void;
+        onError: (res: any) => void;
+        play: () => void;
+        pause: () => void;
+        src: string;
+    }
+}
+

packages/mars-core/types/vue/index.d.ts

@@ -0,0 +1,40 @@
+import { Vue } from "./vue";
+
+export default Vue;
+
+export as namespace Vue;
+
+export {
+  CreateElement,
+  VueConstructor
+} from "./vue";
+
+export {
+  Component,
+  AsyncComponent,
+  ComponentOptions,
+  FunctionalComponentOptions,
+  RenderContext,
+  PropType,
+  PropOptions,
+  ComputedOptions,
+  WatchHandler,
+  WatchOptions,
+  WatchOptionsWithHandler,
+  DirectiveFunction,
+  DirectiveOptions
+} from "./options";
+
+export {
+  PluginFunction,
+  PluginObject
+} from "./plugin";
+
+export {
+  VNodeChildren,
+  VNodeChildrenArrayContents,
+  VNode,
+  VNodeComponentOptions,
+  VNodeData,
+  VNodeDirective
+} from "./vnode";