@cloudbase/lowcode-builder 0.0.5 → 0.1.3

package/lib/builder/core/index.d.ts

@@ -1,4 +1,5 @@
 import { IInstallOpts } from '../service/webpack';
+export { getCompileDirs } from '../util';
 import { IMaterialItem, IWeAppData, IPlugin, IExtraData } from '@cloudbase/lowcode-generator/lib/weapps-core';
 import { BuildType, GenerateMpType, WebpackBuildCallBack, WebpackModeType } from '../types/common';
 import { DEPLOY_MODE, RUNTIME } from '../../types';
@@ -37,6 +38,7 @@ export interface IBuildWedaApp extends IBaseAppProps {
     };
 }
 export declare function buildWedaApp({ cals, subAppCalsList, dependencies, appKey, runtime, ignoreInstall, buildTypeList, mode, devTool, deployOptions, generateMpType, plugins, extraData, resourceAppId, domain, output, }: IBuildWedaApp, cb?: WebpackBuildCallBack): Promise<string | undefined>;
+export declare function cleanComponentDir(): Promise<void>;
 export declare function installDep(dir: any, opts?: IInstallOpts): Promise<void>;
 export declare const version: any;
 export default buildWedaApp;

package/lib/builder/core/index.js

@@ -3,10 +3,12 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.version = exports.installDep = exports.buildWedaApp = void 0;
+exports.version = exports.installDep = exports.cleanComponentDir = exports.buildWedaApp = exports.getCompileDirs = void 0;
 const fs_extra_1 = __importDefault(require("fs-extra"));
 const webpack_1 = require("../service/webpack");
 const util_1 = require("../util");
+var util_2 = require("../util");
+Object.defineProperty(exports, "getCompileDirs", { enumerable: true, get: function () { return util_2.getCompileDirs; } });
 const common_1 = require("../types/common");
 const index_1 = require("../mp/index");
 const path_1 = __importDefault(require("path"));
@@ -122,6 +124,10 @@ async function buildWedaApp({ cals, subAppCalsList = [], dependencies = [], appK
     }
 }
 exports.buildWedaApp = buildWedaApp;
+async function cleanComponentDir() {
+    return fs_extra_1.default.emptyDir((0, util_1.getCompileDirs)().materialsDir);
+}
+exports.cleanComponentDir = cleanComponentDir;
 function installDep(dir, opts = {}) {
     return (0, webpack_1.installDependencies)(dir, opts);
 }

package/lib/builder/h5/copy.js

@@ -55,7 +55,7 @@ exports.runCopy = runCopy;
 async function copyMaterialLibraries(dependencies = [], materialsDir, appBuildDir) {
     const localPkg = (0, common_1.getCurrentPackageJson)();
     await Promise.all(dependencies.map(async (componentLib) => {
-        var _a;
+        var _a, _b, _c, _d, _e;
         const { name, version } = componentLib;
         const materialNameVersion = `${name}@${version}`;
         const materialDir = path.join(materialsDir, materialNameVersion);
@@ -86,6 +86,9 @@ async function copyMaterialLibraries(dependencies = [], materialsDir, appBuildDi
         // 副作用修改了dependence定义，trycatch 不阻塞主流程
         try {
             const meta = (0, common_1.readComponentLibMata)(librariesDir);
+            if (meta === null || meta === void 0 ? void 0 : meta.schemaVersion) {
+                componentLib['schemaVersion'] = meta === null || meta === void 0 ? void 0 : meta.schemaVersion;
+            }
             let [major] = ((_a = meta === null || meta === void 0 ? void 0 : meta.schemaVersion) === null || _a === void 0 ? void 0 : _a.split('.')) || [];
             if (Number(major) >= 3) {
                 componentLib['isPlainProps'] = true;
@@ -94,8 +97,19 @@ async function copyMaterialLibraries(dependencies = [], materialsDir, appBuildDi
         catch (e) { }
         try {
             const packageJson = fs_extra_1.default.readJsonSync(path.join(materialDir, 'package.json'));
-            if (packageJson.lowcode) {
-                componentLib['entry'] = path.posix.relative(srcDir, packageJson.lowcode);
+            if ((_c = (_b = packageJson.weda) === null || _b === void 0 ? void 0 : _b.platform) === null || _c === void 0 ? void 0 : _c.web) {
+                const entries = (_e = (_d = packageJson.weda) === null || _d === void 0 ? void 0 : _d.platform) === null || _e === void 0 ? void 0 : _e.web;
+                componentLib['entries'] = {
+                    entry: path.posix.relative(srcDir, entries.entry),
+                    components: path.posix.relative(srcDir, entries.components),
+                    actions: path.posix.relative(srcDir, entries.actions),
+                };
+            }
+            else if (packageJson.lowcode) {
+                const entry = path.posix.relative(srcDir, packageJson.lowcode);
+                componentLib['entries'] = {
+                    entry,
+                };
             }
         }
         catch (e) { }

package/lib/builder/mp/wxml.js

@@ -105,7 +105,11 @@ function generateWxml(widgets, docTag, wxmlDataPrefix, ctx, usingComponents, com
                 elements.push({
                     type: 'element',
                     name: tagName,
-                    attributes: { name: data0.name.value },
+                    attributes: {
+                        name: data0.name.type && data0.name.type !== 'static'
+                            ? `{{${id}.name}}`
+                            : data0.name.value,
+                    },
                     elements: [],
                     _order: xIndex || 0,
                     _parent: null,

package/lib/tests/build.js

@@ -7,10 +7,12 @@ const index_1 = require("../index");
 const data_1 = __importDefault(require("./data"));
 const path_1 = __importDefault(require("path"));
 const fs_extra_1 = __importDefault(require("fs-extra"));
+const common_1 = require("../src/builder/types/common");
 const outPath = path_1.default.resolve(__dirname, '.temp');
 fs_extra_1.default.emptyDirSync(outPath);
 (0, index_1.buildWedaApp)({
     ...data_1.default,
+    buildTypeList: [common_1.BuildType.WEB],
     output: { path: outPath },
 }).then((dir) => {
     console.log(dir);

package/lib/tests/build.test.js

@@ -7,12 +7,14 @@ const index_1 = require("../index");
 const data_1 = __importDefault(require("./data"));
 const path_1 = __importDefault(require("path"));
 const fs_extra_1 = __importDefault(require("fs-extra"));
+const common_1 = require("../lib/builder/types/common");
 describe('build', () => {
     it('needs tests', async () => {
         const outPath = path_1.default.resolve(__dirname, './temp');
         fs_extra_1.default.emptyDir(outPath);
         let dir = await (0, index_1.buildWedaApp)({
             ...data_1.default,
+            buildTypeList: [common_1.BuildType.WEB],
             output: { path: outPath },
         });
         console.log(dir);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cloudbase/lowcode-builder",
-  "version": "0.0.5",
+  "version": "0.1.3",
   "description": "云开发 Tencent CloudBase Framework Low Code Plugin，将低码配置生成完整项目并一键部署云开发资源。",
   "author": "yhsunshining@gmail.com",
   "homepage": "https://github.com/TencentCloudBase/cloudbase-framework#readme",
@@ -26,14 +26,15 @@
     "dev": "tsc -w",
     "develop": "tsc -w",
     "build": "tsc",
-    "test": "jest"
+    "test": "jest",
+    "test:build": "ts-node ./__test__/build.ts"
   },
   "bugs": {
     "url": "https://github.com/TencentCloudBase/cloudbase-framework/issues"
   },
   "dependencies": {
     "@cloudbase/cals": "0.3.3",
-    "@cloudbase/lowcode-generator": "0.5.1",
+    "@cloudbase/lowcode-generator": "^0.6.13",
     "axios": "^0.21.0",
     "chalk": "^2.4.2",
     "compare-versions": "^3.6.0",
@@ -64,6 +65,7 @@
     "csstype": "^2.6.10",
     "jest": "^26.0.1",
     "ts-jest": "^27.0.5",
+    "ts-node": "^10.4.0",
     "typescript": "^4.4.2"
   }
 }

package/template/html/index.html.ejs

@@ -26,8 +26,8 @@
     <% if(mode !== 'production'){ %>
     <!-- <script src="https://cdn.bootcdn.net/ajax/libs/vConsole/3.3.4/vconsole.min.js"></script>
     <script>new VConsole()</script> -->
-    <% }%> <% Array.isArray(jsApis) &&
-    jsApis.filter(function(item){return !!item}).forEach(function(jsApi){%>
+    <% }%> <% Array.isArray(jsApis) && jsApis.filter(function(item){return
+    !!item}).forEach(function(jsApi){%>
     <script src="<%=jsApi %>"></script>
     <% })%>
 
@@ -373,10 +373,8 @@
     <div id="root" class="main-wrap"></div>
     <% if(canUseVite){ %>
     <script type="module" src="/src/index.jsx"></script>
-    <% } %>
-
-    <% if(!isAdminPortal){ %>
-    <script src="//imgcache.qq.com/qcloud/cloudbase-js-sdk/1.5.3-alpha.0/cloudbase.full.js"></script>
+    <% } %> <% if(!isAdminPortal){ %>
+    <script src="https://imgcache.qq.com/qcloud/cloudbase-js-sdk/1.5.3-alpha.0/cloudbase.full.js"></script>
     <% }%>
     <script>
       if (window.cloudbase) {
@@ -431,10 +429,9 @@
       }
     </script>
     <script
-      src="//qbase.cdn-go.cn/lcap/lcap-resource-cdngo/-/0.1.2/_url/ajax/libs/mobx/5.15.7/mobx.umd.js"
+      src="https://qbase.cdn-go.cn/lcap/lcap-resource-cdngo/-/0.1.2/_url/ajax/libs/mobx/5.15.7/mobx.umd.js"
       crossorigin="anonymous"
     ></script>
-    <script src="//qbase.cdn-go.cn/lcap/lcap-resource-cdngo/-/release/_npm/@cloudbase/weda-cloud-sdk@stable/dist/h5.browser.js"></script>
-    <script src="//qbase.cdn-go.cn/lcap/lcap-resource-cdngo/-/0.1.2/_url/npm/@zxing/library@0.18.6/umd/index.min.js"></script>
+    <script src="https://qbase.cdn-go.cn/lcap/lcap-resource-cdngo/-/0.1.2/_url/npm/@zxing/library@0.18.6/umd/index.min.js"></script>
   </body>
 </html>

package/template/mp/app/weapps-api.js

@@ -1,19 +1,19 @@
 import { observable } from 'mobx'
-import { createComputed, formatDate, getter, setter } from '<%= subLevelPath %>../common/util'
+import { createMpApp } from '@cloudbase/weda-client';
+import { createComputed } from '<%= subLevelPath %>../common/util'
 import process from '<%= subLevelPath %>../common/process'
-import { DS_SDK, CLOUD_SDK, createDataset, EXTRA_API } from '<%= subLevelPath %>../datasources/index'
 import appGlobal from '<%= subLevelPath %>../app/app-global'
-import weappApis from '<%= subLevelPath %>../common/weapp-sdk'
+import { createDataset, EXTRA_API } from '<%= subLevelPath %>../datasources/index'
 
 <% if (!isBare) {%>
 import state from '../lowcode/state'
-import computed from '../lowcode/computed'
-import common from './common'
+  import computed from '../lowcode/computed'
+  import common from './common'
 <%} else {%>
 const state = {}
-const computed ={}
-const common = {}
-<%}%>
+  const computed = {}
+  const common = {}
+    <%}%>
 
 const mainAppKey = '__weappsMainApp'
 
@@ -21,12 +21,11 @@ export const app = createGlboalApi()
 export { process }
 
 function createGlboalApi() {
+  const mpApp = createMpApp();
   const globalAPI = {
     id: '<%= appId %>',
     domain: '<%= domain %>',
-    platform: 'MINIPROGRAME',
     activePage: null,
-    dataSources: DS_SDK,
     pages: {},
     session: {
       //configure: sdk.configure,
@@ -36,11 +35,7 @@ function createGlboalApi() {
     state: observable(state),
     computed: createComputed(computed),
     common,
-    utils: {
-      formatDate,
-      get: getter,
-      set: setter,
-    },
+    ...mpApp
     // ... other sdk apis & apis from mp
   } // The global api exposed to lowcode
 
@@ -52,18 +47,16 @@ function createGlboalApi() {
       globalAPI.utils.set(globalAPI.dataset.state, keyPath, userSetState[keyPath]);
     });
   };
-   /**
-   * 内部通用的设置状态变量值的方法
-   *  varPath 结构为 $global.<变量名> 即全局变量
-   *                $page.<变量名>  即当前页面变量
-   *                <pageId>.<变量名> 指定页面 pageId 的变量 (应当避免修改非当前页面的变量值)
-   */
+  /**
+  * 内部通用的设置状态变量值的方法
+  *  varPath 结构为 $global.<变量名> 即全局变量
+  *                $page.<变量名>  即当前页面变量
+  *                <pageId>.<变量名> 指定页面 pageId 的变量 (应当避免修改非当前页面的变量值)
+  */
   globalAPI._setStateVal = (config) => {
     // @ts-ignore
     EXTRA_API.setState(config.varPath, config.val);
   };
-  // mount wx apis
-  Object.assign(globalAPI, weappApis)
 
   const subPackageName = '<%= subPackageName %>'
   if (subPackageName) {
@@ -75,33 +68,12 @@ function createGlboalApi() {
     // is mainApp
     appGlobal[mainAppKey] = globalAPI
   }
-  // 避免被wx.cloud 覆盖
-  globalAPI.cloud = CLOUD_SDK
 
   // # expose some sdk modules
   /* const sdkModsIncluded = ['flow', 'getPageOptions', 'getLaunchOptions']
   sdkModsIncluded.forEach(key => {
     globalAPI[key] = sdk[key]
   }) */
-  const { scanCode } = globalAPI
-  globalAPI.scanCode = (options) => {
-    const {enableDefaultBehavior, ...restOptions} = options;
-    const shouldReturnPromise = (!restOptions.success && !restOptions.complete && !restOptions.fail);
-    if(shouldReturnPromise) {
-      return new Promise((resolve, reject) => {
-        scanCode(restOptions).then((res) => {
-          if(enableDefaultBehavior) {
-            globalAPI.showModal({
-              title: '扫描到以下内容',
-              content: res.result,
-              showCancel: false,
-            })
-          }
-          resolve(res)
-        })
-        .catch(reject)
-      })
-    }
-  }
+
   return globalAPI
 }

package/template/mp/app.js

@@ -1,79 +1,79 @@
-import { setConfig } from '@cloudbase/weda-cloud-sdk'
+import { setConfig } from './datasources/index'
 import lifeCycle from './lowcode/lifecycle'
 import { app } from './app/weapps-api'
 import WxReportV2 from './common/wx_yypt_report_v2'
 // 引入数据源管理器并进行初始化
 import { EXTRA_API, createStateDataSourceVar, generateParamsParser } from './datasources/index'
 const $app = app;
-<% if(yyptConfig.yyptAppKey) { %>
+<% if (yyptConfig.yyptAppKey) { %>
 const wxReport = new WxReportV2({
-    appKey: '<%= yyptConfig.yyptAppKey %>', // 填入你申请的运营平台的应用key(必填)
-    reportUrl: '<%= yyptConfig.reportUrl %><%= yyptConfig.yyptAppKey %>', // 上报url（把后端上报接口需要先挂网关，该url填写网关地址）
-    autoReportPV: true, // 是否自动上报页面PV
-    // getRemoteParamsUrl获取远程参数url，主要用于获取intervalTime、reportLogsNum和stopReport参数，
-    // 返回格式{stopReport:true,intervalTime:3,reportLogsNum:5}
-    getRemoteParamsUrl: '',
-    stopReport: <%= yyptConfig.stopReport %>, // 停止上报
-    intervalTime: 3, // 间隔多久执行一次上报，默认3秒
-    reportLogsNum: 5, // 每次合并上报记录条数，默认5次
+  appKey: '<%= yyptConfig.yyptAppKey %>', // 填入你申请的运营平台的应用key(必填)
+  reportUrl: '<%= yyptConfig.reportUrl %><%= yyptConfig.yyptAppKey %>', // 上报url（把后端上报接口需要先挂网关，该url填写网关地址）
+  autoReportPV: true, // 是否自动上报页面PV
+  // getRemoteParamsUrl获取远程参数url，主要用于获取intervalTime、reportLogsNum和stopReport参数，
+  // 返回格式{stopReport:true,intervalTime:3,reportLogsNum:5}
+  getRemoteParamsUrl: '',
+  stopReport: <%= yyptConfig.stopReport %>, // 停止上报
+  intervalTime: 3, // 间隔多久执行一次上报，默认3秒
+  reportLogsNum: 5, // 每次合并上报记录条数，默认5次
 });
 
-// 设置数据源请求的 loading 及 toast 处理
-setConfig({
-  beforeDSRequest: (cfg) => {
-    if (!cfg.options || !cfg.options.showLoading) return
-    app.showLoading()
-  },
-  afterDSRequest: (cfg, error, result) => {
-    if (!cfg.options) return
-    if (cfg.options.showLoading) app.hideLoading()
-    if (!cfg.options.showToast) return
-    const isSuccess = !error && result && !result.code
-    app.showToast({icon: isSuccess ? 'success' : 'error'})
-  }
-})
-
-<% }%>
-App({
-  onLaunch(options) {
-    this.app = app
-    const onLaunch = lifeCycle.onLaunch || lifeCycle.onAppLaunch
-    let { query={} } = options
-    EXTRA_API.setParams('$global', query )
-    createStateDataSourceVar('$global', generateParamsParser({app}))
+  // 设置数据源请求的 loading 及 toast 处理
+  setConfig({
+    beforeDSRequest: (cfg) => {
+      if (!cfg.options || !cfg.options.showLoading) return
+      app.showLoading()
+    },
+    afterDSRequest: (cfg, error, result) => {
+      if (!cfg.options) return
+      if (cfg.options.showLoading) app.hideLoading()
+      if (!cfg.options.showToast) return
+      const isSuccess = !error && result && !result.code
+      app.showToast({ icon: isSuccess ? 'success' : 'error' })
+    }
+  })
 
-    onLaunch && onLaunch.call(this, options)
-    <% if(yyptConfig.yyptAppKey) { %>
-    // 挂运营平台上报对象到app里
-    app.yyptReport = wxReport
     <% }%>
+      App({
+        onLaunch(options) {
+          this.app = app
+          const onLaunch = lifeCycle.onLaunch || lifeCycle.onAppLaunch
+          let { query = {} } = options
+          EXTRA_API.setParams('$global', query)
+          createStateDataSourceVar('$global', generateParamsParser({ app }))
 
-    // 初始私有全局数据
-    this.$$global = {
-      homePageId: '<%= appConfig.homePageId %>'
-    }
-  },
-  onShow(options) {
-    const fn = lifeCycle.onShow || lifeCycle.onAppShow
-    fn && fn.call(this, options)
-    <% if(yyptConfig.yyptAppKey) { %>
-    wxReport.startReport()
-    <% }%>
-  },
-  onHide() {
-    const fn = lifeCycle.onHide || lifeCycle.onAppHide
-    fn && fn.call(this)
-  },
-  onError(msg) {
-    const fn = lifeCycle.onError || lifeCycle.onAppError
-    fn && fn.call(this, msg)
-  },
-  onPageNotFound() {
-    const fn = lifeCycle.onPageNotFound || lifeCycle.onAppPageNotFound
-    fn && fn.call(this)
-  },
-  onUnhandledRejection() {
-    const fn = lifeCycle.onUnhandledRejection || lifeCycle.onAppUnhandledRejection
-    fn && fn.call(this)
+          onLaunch && onLaunch.call(this, options)
+            <% if (yyptConfig.yyptAppKey) { %>
+              // 挂运营平台上报对象到app里
+              app.yyptReport = wxReport
+                <% }%>
+
+                  // 初始私有全局数据
+                  this.$$global = {
+            homePageId: '<%= appConfig.homePageId %>'
+          }
+        },
+        onShow(options) {
+          const fn = lifeCycle.onShow || lifeCycle.onAppShow
+          fn && fn.call(this, options)
+            <% if (yyptConfig.yyptAppKey) { %>
+              wxReport.startReport()
+              <% }%>
   },
-})
+        onHide() {
+          const fn = lifeCycle.onHide || lifeCycle.onAppHide
+          fn && fn.call(this)
+        },
+        onError(msg) {
+          const fn = lifeCycle.onError || lifeCycle.onAppError
+          fn && fn.call(this, msg)
+        },
+        onPageNotFound() {
+          const fn = lifeCycle.onPageNotFound || lifeCycle.onAppPageNotFound
+          fn && fn.call(this)
+        },
+        onUnhandledRejection() {
+          const fn = lifeCycle.onUnhandledRejection || lifeCycle.onAppUnhandledRejection
+          fn && fn.call(this)
+        },
+      })

package/template/mp/common/weapp-page.js

@@ -2,7 +2,7 @@ import { observable } from 'mobx';
 import { createComputed, createEventHandlers, checkAuth } from './util';
 import { createWidgets, createInitData, disposeWidget } from './widget';
 import mergeRenderer from './merge-renderer';
-import { createDataset, EXTRA_API, createStateDataSourceVar, generateParamsParser } from '../datasources/index';
+import { createDataset, EXTRA_API, createStateDataSourceVar, generateParamsParser, setConfig } from '../datasources/index';
 import { runWatchers } from './watch'
 
 export function createPage(
@@ -71,6 +71,7 @@ export function createPage(
       ...mergeRenderer,
       onLoad(options) {
         const $page = this.getWeAppInst()
+        setConfig({ currentPageId: $page.uuid });
         app.activePage = $page;
         this._pageActive = true;
 
@@ -97,6 +98,7 @@ export function createPage(
       },
       async onShow() {
         const $page = this.getWeAppInst()
+        setConfig({ currentPageId: $page.uuid });
         app.activePage = $page;
         this._pageActive = true;
 

package/template/mp/datasources/config.js.tpl

@@ -1,5 +1,5 @@
-import dataSourceProfiles from './datasource-profiles'
 import datasetProfiles from './dataset-profiles'
+const dataSourceProfiles = require('./datasource-profiles.js')
 
 /**
  * 数据源基本配置

package/template/mp/datasources/datasource-profiles.js.tpl

@@ -1,4 +1,4 @@
 /**
  * 数据源摘要描述数组
  */
-export default <%= datasourceProfiles %>
+module.exports = <%= datasourceProfiles %>

package/template/mp/datasources/index.js

@@ -1,8 +1,16 @@
-import {
+import { WEDA_CLOUD_SDK } from '@cloudbase/weda-client'
+const {
   setConfig,
   initTcb,
-  CLOUD_SDK
-} from '@cloudbase/weda-cloud-sdk'
+  CLOUD_SDK,
+  createDataset,
+  createStateDataSourceVar,
+  generateParamsParser,
+  EXTRA_API,
+  DS_API,
+  DS_SDK
+} = WEDA_CLOUD_SDK
+
 export {
   createDataset,
   createStateDataSourceVar,
@@ -11,7 +19,8 @@ export {
   CLOUD_SDK,
   DS_API,
   DS_SDK,
-} from '@cloudbase/weda-cloud-sdk'
+  setConfig
+}
 
 import config from './config'
 

package/template/mp/package.json

@@ -1,15 +1,16 @@
 {
 	"name": "lcap-<%= appId%>",
-	"version": "1.0.0",
-	"scripts": {	},
+	"version": "1.0.8",
+	"scripts": {},
 	"dependencies": {
-		"@cloudbase/weda-cloud-sdk": "stable",
-    "mobx": "^5.15.4",
-    "lodash.get": "^4.4.2",
-    "lodash.set": "^4.3.2",
-    "miniprogram-gesture": "^1.0.6",
-    "miniprogram-api-promise": "^1.0.4"<% Object.keys(extraDeps).map(depName => {%>,
-		"<%= depName%>": "<%= extraDeps[depName]%>"<%})
+		"@cloudbase/weda-client": "stable",
+		"mobx": "^5.15.4",
+		"lodash.get": "^4.4.2",
+		"lodash.set": "^4.3.2",
+		"miniprogram-gesture": "^1.0.6",
+		"miniprogram-api-promise": "^1.0.4"<% Object.keys(extraDeps).map(depName => {%>,
+			"<%= depName%>": "<%= extraDeps[depName]%>"<%
+		})
 		%>
-  }
-}
+	}
+}

package/template/package.json

@@ -6,10 +6,10 @@
   },
   "dependencies": {
     "@cloudbase/js-sdk": "1.5.3-alpha.0",
-    "@cloudbase/weda-cloud-sdk": "stable",
     "@tcwd/weapps-core": "2.2.6",
     "@tcwd/weapps-sdk": "1.2.9",
     "@zxing/library": "^0.18.6",
+    "@cloudbase/weda-client": "stable",
     "fastclick": "^1.0.6",
     "lodash": "^4.17.19",
     "mobx": "^5.15.4",
@@ -54,8 +54,10 @@
     "mini-css-extract-plugin": "^0.8.0",
     "hard-source-webpack-plugin": "^0.13.1",
     "html-webpack-plugin": "^3.2.0",
+    "ts-loader": "^8.3.0",
+    "typescript": "^4.4.4",
     "webpack": "^4.41.4",
     "webpack-cli": "^4.2.0",
     "webpack-dev-server": "^3.11.0"
   }
-}
+}

package/template/src/app/global-api.js

@@ -1,6 +1,5 @@
 import * as sdk from '@tcwd/weapps-sdk';
 import { createComputed } from 'utils';
-import { DS_SDK, CLOUD_SDK, createDataset, EXTRA_API } from '../datasources';
 import store, { subPackageName } from '../store';
 import computed from '../store/computed';
 import common from './common';
@@ -8,6 +7,8 @@ import { formatDate } from '../utils/date';
 import { getter, setter, _isMobile } from '../utils';
 import actionMap from './material-actions';
 import { scanCodeApi } from '../utils/scan-code-action';
+import { createWebApp, ACTIONS_KEY, ROUTER_KEY } from '@cloudbase/weda-client';
+import { createDataset, EXTRA_API } from '../datasources/index'
 
 const mainAppKey = '__weappsMainApp';
 const appGlobal = process.env.isMiniprogram ? getApp() : window;
@@ -20,10 +21,10 @@ export function setCurrentPage(pageCtx) {
 }
 
 function createGlboalApi() {
+  const mpApp = createWebApp();
   const globalAPI = {
     id: '<%= appId %>',
     domain: '<%= domain %>',
-    platform: 'WEB',
     formActions: {},
     pages: {},
     session: {
@@ -34,12 +35,7 @@ function createGlboalApi() {
     state: store,
     computed: createComputed(computed.global),
     common,
-    dataSources: DS_SDK,
-    utils: {
-      formatDate,
-      get: getter,
-      set: setter,
-    },
+    ...mpApp
     // ... other sdk apis & apis from mp
   }; // The global api exposed to lowcode
 
@@ -81,8 +77,6 @@ function createGlboalApi() {
   sdkModsIncluded.forEach((key) => {
     globalAPI[key] = sdk[key];
   });
-  // 避免被wx.cloud 覆盖
-  globalAPI.cloud = CLOUD_SDK;
 
   return globalAPI;
 }
@@ -103,80 +97,9 @@ function createPageApi() {
 export const mountAPIs = (sdks) => {
   Object.keys(sdks).forEach((item) => {
     let action = sdks[item];
-
-    switch (item) {
-      case 'showToast': {
-        action = function (obj) {
-          if (obj.icon === 'error' && !obj.image) {
-            return sdks[item]({
-              ...obj,
-              image:
-                'data:image/svg+xml,%3Csvg%20width%3D%22120%22%20height%3D%22120%22%20viewBox%3D%220,0,24,24%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M12%2010.586l5.657-5.657%201.414%201.414L13.414%2012l5.657%205.657-1.414%201.414L12%2013.414l-5.657%205.657-1.414-1.414L10.586%2012%204.929%206.343%206.343%204.93%2012%2010.586z%22%20fill-rule%3D%22evenodd%22%20fill%3D%22white%22%2F%3E%3C%2Fsvg%3E',
-            });
-          }
-          return sdks[item](obj);
-        };
-        break;
-      }
-      case 'showModal': {
-        const OFFICIAL_COMPONENT_LIB = 'gsd-h5-react';
-        const showModal =
-          actionMap[OFFICIAL_COMPONENT_LIB] &&
-          actionMap[OFFICIAL_COMPONENT_LIB].showModal;
-        if (!_isMobile() && showModal) {
-          action = function (params) {
-            return showModal({ data: params });
-          };
-        }
-        break;
-      }
-      case 'scanCode': {
-        action = (options) => {
-          if (
-            !options ||
-            (!options.success && !options.fail && !options.complete)
-          ) {
-            return new Promise((resolve, reject) => {
-              scanCodeApi({
-                ...options,
-                success: resolve,
-                fail: reject,
-              });
-            });
-          }
-          scanCodeApi(options);
-        };
-        break;
-      }
-      case 'navigateTo':
-      case 'reLaunch':
-      case 'redirectTo': {
-        action = function (obj) {
-          if (obj.mode === 'web' && process.env.isMiniprogram) {
-            console.warn('url navigation can only be used in h5 build');
-            return;
-          }
-          const { url, ...restOpts } = obj;
-          if (obj.mode === 'web') {
-            if (item === 'navigateTo') {
-              window.open(url);
-            } else {
-              window.location.href = url;
-            }
-          } else {
-            return sdks[item]({
-              ...restOpts,
-              pageId: restOpts.pageId
-                ? restOpts.pageId.replace(/^(\.)?\//, '')
-                : restOpts.pageId,
-            });
-          }
-        };
-        break;
-      }
+    if (!(item in ACTIONS_KEY) && !(item in ROUTER_KEY)) {
+      app[item] = action;
     }
-
-    app[item] = action;
   });
   return app;
 };

package/template/src/app/material-actions.js

@@ -1,14 +1,16 @@
 // Imports all material actions
-<% materials.map((material,index) => { if(material.entry){ %>
-import <%= _.camelCase(material.name)%>_<%= index%> from 'libraries/<%=material.name%>@<%= material.version %>/<%=material.entry%>';
-const <%= _.camelCase(material.name)%>Actions_<%= index%> = <%= _.camelCase(material.name)%>_<%= index%>.actions
-<% } else { (material.actions || []).map(act => {%>
-import <%= _.camelCase(material.name)%>_<%=act.name%> from 'libraries/<%=material.name%>@<%= material.version %>/actions/<%= act.name %>'
-<% }) }}) %>
-export default {
-  <% materials.map((material, index) => {
-  %>  ['<%= material.name%>']:<% if(material.entry){ %> <%=_.camelCase(material.name)%>Actions_<%= index%>,
-  <% }else{ %> {<% (material.actions || []).map(act => { %>
-      ['<%= act.name%>']: <%= _.camelCase(material.name)%>_<%=act.name%>,<%})%>
-    },
-  <%}}) %>}
+<% materials.map((material,index) => { if(material.entries && material.entries.actions){ %>
+  import * as <%= _.camelCase(material.name)%>Actions_<%= index%> from 'libraries/<%=material.name%>@<%= material.version %>/<%=material.entries.actions%>';
+  <% } else if(material.entries && material.entries.entry) {%>
+  import <%= _.camelCase(material.name)%>_<%= index%> from 'libraries/<%=material.name%>@<%= material.version %>/<%=material.entries.entry%>';
+  const <%= _.camelCase(material.name)%>Actions_<%= index%> = <%= _.camelCase(material.name)%>_<%= index%>.actions
+  <% } else { (material.actions || []).map(act => {%>
+  import <%= _.camelCase(material.name)%>_<%=act.name%> from 'libraries/<%=material.name%>@<%= material.version %>/actions/<%= act.name %>'
+  <% }) }}) %>
+  export default {
+    <% materials.map((material, index) => {
+    %>  ['<%= material.name%>']:<% if(material.entries && (material.entries.entry || material.entries.actions)){ %> <%=_.camelCase(material.name)%>Actions_<%= index%>,
+    <% }else{ %> {<% (material.actions || []).map(act => { %>
+        ['<%= act.name%>']: <%= _.camelCase(material.name)%>_<%=act.name%>,<%})%>
+      },
+    <%}}) %>}

package/template/src/datasources/index.js

@@ -1,6 +1,18 @@
-import { setConfig, initTcb } from '@cloudbase/weda-cloud-sdk/dist/h5';
+import { WEDA_CLOUD_SDK } from '@cloudbase/weda-client'
 import config from './config';
 
+const {
+  setConfig,
+  initTcb,
+  CLOUD_SDK,
+  createDataset,
+  createStateDataSourceVar,
+  generateParamsParser,
+  EXTRA_API,
+  DS_API,
+  DS_SDK
+} = WEDA_CLOUD_SDK
+
 export {
   createDataset,
   createStateDataSourceVar,
@@ -9,7 +21,8 @@ export {
   CLOUD_SDK,
   DS_API,
   DS_SDK,
-} from '@cloudbase/weda-cloud-sdk/dist/h5';
+  setConfig
+}
 
 setConfig(config);
 initTcb();

package/template/src/index.jsx

@@ -1,6 +1,6 @@
 import * as React from 'react'
 import * as ReactDOM from 'react-dom'
-import { setConfig } from '@cloudbase/weda-cloud-sdk/dist/h5'
+import { setConfig } from './datasources/index'
 import App from './router'
 import './utils/monitor-jssdk.min'
 import './index.less'

package/template/webpack/web.prod.js

@@ -6,9 +6,10 @@ const MiniCssExtractPlugin = require('mini-css-extract-plugin');
 const CopyWebpackPlugin = require('copy-webpack-plugin');
 const themeVars = require('./themeVars');
 const HappyPack = require('happypack');
-const core = 4;
+const core = 7;
 const happyThreadPool = HappyPack.ThreadPool({ size: core });
 
+const TS_LOADER_ID = 'ts-loader';
 module.exports = function (options) {
   const {
     context,
@@ -22,54 +23,69 @@ module.exports = function (options) {
     definePlugin = {},
   } = options;
   const isDevelopment = mode !== 'production';
+  const babelLoader = {
+    loader: 'babel-loader',
+    options: {
+      compact: false,
+      cacheDirectory: true,
+      cwd: context,
+      presets: [
+        [
+          '@babel/preset-env',
+          {
+            modules: false,
+            targets: {
+              esmodules: true,
+            },
+          },
+        ],
+        '@babel/preset-react',
+      ],
+      plugins: [
+        [
+          'babel-plugin-import',
+          {
+            libraryName: '@govcloud/gsd-kbone-react',
+            libraryDirectory: 'lib/components',
+            camel2DashComponentName: false,
+          },
+        ],
+        '@babel/plugin-proposal-class-properties',
+        ['@babel/plugin-proposal-decorators', { legacy: true }],
+        '@babel/plugin-proposal-export-default-from',
+        '@babel/plugin-proposal-export-namespace-from',
+        '@babel/plugin-proposal-optional-chaining',
+        '@babel/plugin-proposal-partial-application',
+        ['@babel/plugin-proposal-pipeline-operator', { proposal: 'minimal' }],
+      ].filter(Boolean),
+    },
+  };
+
   let plugins = [
     new HappyPack({
-      id: 'babel',
+      id: TS_LOADER_ID,
       loaders: [
+        babelLoader,
         {
-          loader: 'babel-loader',
+          loader: 'ts-loader',
           options: {
-            compact: false,
-            cacheDirectory: true,
-            cwd: context,
-            presets: [
-              [
-                '@babel/preset-env',
-                {
-                  targets: {
-                    esmodules: true,
-                  },
-                  useBuiltIns: 'usage',
-                  corejs: '2.6.12',
-                },
-              ],
-              '@babel/preset-react',
-            ],
-            plugins: [
-              [
-                'babel-plugin-import',
-                {
-                  libraryName: '@govcloud/gsd-kbone-react',
-                  libraryDirectory: 'lib/components',
-                  camel2DashComponentName: false,
-                },
-              ],
-              '@babel/plugin-proposal-class-properties',
-              ['@babel/plugin-proposal-decorators', { legacy: true }],
-              '@babel/plugin-proposal-export-default-from',
-              '@babel/plugin-proposal-export-namespace-from',
-              '@babel/plugin-proposal-optional-chaining',
-              '@babel/plugin-proposal-partial-application',
-              [
-                '@babel/plugin-proposal-pipeline-operator',
-                { proposal: 'minimal' },
-              ],
-            ].filter(Boolean),
+            compilerOptions: {
+              target: 'ESNext',
+              module: 'ESNext',
+              esModuleInterop: true,
+            },
+            happyPackMode: true,
+            transpileOnly: true,
           },
         },
       ],
       threadPool: happyThreadPool,
     }),
+    new HappyPack({
+      id: 'babel',
+      loaders: [babelLoader],
+      threadPool: happyThreadPool,
+    }),
     new HtmlWebpackPlugin({
       template: htmlTemplatePath,
       filename: 'index.html',
@@ -125,7 +141,7 @@ module.exports = function (options) {
     },
     devtool: isDevelopment ? 'eval' : false,
     resolve: {
-      extensions: ['.js', '.jsx', '.tsx', '.json', '.scss', '.css'],
+      extensions: ['.js', '.jsx', '.ts', '.tsx', '.json', '.scss', '.css'],
       modules: [...resolveModules],
       symlinks: false,
       cacheWithContext: false,
@@ -135,10 +151,15 @@ module.exports = function (options) {
     },
     module: {
       rules: [
+        {
+          test: /\.tsx?$/,
+          exclude: /node_modules\/(?!@cloudbase\/weda-ui)|gsd-kbone-react/,
+          use: [`happypack/loader?id=${TS_LOADER_ID}`],
+        },
         {
           test: /\.(js|jsx)$/,
+          exclude: /node_modules\/(?!@cloudbase\/weda-ui)|gsd-kbone-react/,
           use: ['happypack/loader?id=babel'],
-          exclude: /node_modules\/(?!@cloudbase\/weda-ui)/,
         },
         {
           test: /\.(scss|sass)$/,

package/template/src/pages/composite.tpl

@@ -1,151 +0,0 @@
-import * as React from "react";
-import { observer } from "mobx-react-lite";
-import { observable } from "mobx";
-import { get } from 'lodash'
-
-import { AppRender } from "handlers/render";
-import { createComputed } from "../../../../utils";
-import { createWidgets, retryDataBinds, WidgetsContext, resolveComponentProps } from 'handlers/utils'
-import getStateFn from "./lowcode/state.js";
-import computed from "./lowcode/computed.js";
-import lifecycle from "./lowcode/lifecycle.js";
-import { app, $page } from '../../../../app/global-api'
-
-<% handlersImports.forEach(handler => { %>
-import handler$<%= handler.name %> from "./lowcode/handler/<%= handler.name %>.js";
-<% }) %>
-
-// Import Components
-<% var componentsMap = {}; useComponents.forEach(compItem => {%>
-<% if(compItem.entry){ %><% if(!componentsMap[compItem.moduleName]){ componentsMap[compItem.moduleName] = true %>
-import <%= compItem.moduleNameVar %> from "libraries/<%= compItem.moduleName %>@<%= compItem.version %>/<%= compItem.entry %>";
-<% } %>const { <%= compItem.name %>: <%= compItem.var %> } = <%= compItem.moduleNameVar %>.components
-<% } else { %>import <%= compItem.var %> from "libraries/<%= compItem.moduleName %>@<%= compItem.version %>/components/<%= compItem.name %>";<% } %>
-<%}) %>
-
-import * as constObj from '../../libCommonRes/const'
-import * as toolsObj from '../../libCommonRes/tools'
-
-import "./lowcode/style.less";
-
-const pluginInstances = [];
-
-class CompositeCompWrapper extends React.Component {
-
-  $WEAPPS_COMP = {}
-
-  componentDidUpdate() {
-    const { data } = this.props
-    for(let prop in data) {
-      // 更新 propsData
-      this.propsData[prop] = data[prop]
-    }
-  }
-
-
-  constructor(props) {
-    super(props);
-
-    this.compConfig = <%= JSON.stringify(compConfig, null, 2) %>
-    this.virtualFields = Object.assign({}, props.pageVirtualFields || {}, {
-    <% useComponents.forEach(compItem => {%>
-      "<%= compItem.key %>": <% if(compItem.isPlainProps) {%> (props) => <<%= compItem.var %> {...resolveComponentProps(props, 1)} /> <% } else {%>  (props) => <<%= compItem.var %>{...resolveComponentProps(props, 0)} />  <% }%>,
-    <%}) %>
-    });
-    this.events = (<%= emitEvents %>).reduce((obj, trigger) => {
-      obj[trigger] = (event) => {
-        this.props.emit(trigger, event)
-      };
-      return obj
-    }, {});
-    this.handler = this.$WEAPPS_COMP.handler = {
-      <% handlersImports.forEach(handler => { %>
-      <%= handler.name %>: handler$<%= handler.name %>.bind(this),
-      <% }) %>
-    };
-    this.componentSchema = <%= componentSchema %>;
-    const widgetContext = <%= widgets %>
-    const dataBinds = <%= dataBinds %>
-    const defaultProps = <%= JSON.stringify(defaultProps, null, 2) %>
-    this.propsData = observable(Object.assign({}, defaultProps, this.props.data || {}))
-    this.$WEAPPS_COMP.lib = { const: constObj, tools: toolsObj }
-    this.$WEAPPS_COMP.props = { ...this.props, events: this.events, data: this.propsData }
-    this.state = this.$WEAPPS_COMP.state = observable(getStateFn.bind(this)())
-    this.computed = this.$WEAPPS_COMP.computed = createComputed(computed, this)
-    this.node = this.$WEAPPS_COMP.node = this.createWidgetNode(this) || {}
-    this.widgets = createWidgets(widgetContext, dataBinds, {})
-    // widgets 内的 dataBinds 可能需要关联 widgets，需要重新执行 dataBinds
-    retryDataBinds()
-    Object.keys(this.widgets || {}).forEach(widgetId => {
-      // 将实例 ownerWidget 挂到内部组件上。内部组件就可以通过 $comp.node.ownerWidget 获取到所在的组件实例
-      this.widgets[widgetId].ownerWidget = this.node
-    })
-    this.pageListenerInstances = [];
-    this.createCompAPI(this)
-  }
-
-  createWidgetNode(compThis) {
-    // 当为数组时，需要判断自己属于 widgets 的哪一项
-    const {
-      compositeParent,
-      forIndexes,
-      id
-    } = compThis.props
-    let widgetData = compositeParent
-      ? compositeParent.$WEAPPS_COMP.widgets[id]
-      : $page.widgets[id]
-    if(Array.isArray(widgetData)) {
-      widgetData = widgetData.length > 0 ? get(widgetData, forIndexes) : {}
-    }
-    widgetData = widgetData || {}
-    widgetData.getOwnerWidget = () => compThis.node.ownerWidget
-    widgetData.getConfig = () => compThis.compConfig
-
-    return widgetData
-  }
-
-  createCompAPI(compThis) {
-    compThis.$WEAPPS_COMP = {
-      compConfig: compThis.compConfig,
-      widgets: compThis.widgets,
-      node: compThis.node,
-      handler: compThis.handler,
-      lib: { const: constObj, tools: toolsObj },
-      get props() {
-        return {...compThis.props, events: compThis.events, data: compThis.propsData }
-      },
-      get state() {
-        return compThis.state
-      },
-      get computed() {
-        return compThis.computed
-      },
-    };
-  }
-
-  componentDidMount() {
-    lifecycle.onAttached && lifecycle.onAttached.bind(this)()
-    lifecycle.onReady && lifecycle.onReady.bind(this)()
-  }
-
-  componentWillUnmount() {
-    lifecycle.onDetached && lifecycle.onDetached.bind(this)()
-  }
-
-  render() {
-    return (
-      <WidgetsContext.Provider value={{ parent: this }}>
-        <AppRender
-          className={this.props.className}
-          virtualFields={this.virtualFields}
-          componentSchema={this.componentSchema}
-          codeContext={this}
-        />
-      </WidgetsContext.Provider>
-    );
-  }
-}
-
-export default observer((props) => (
-   <CompositeCompWrapper {...props}></CompositeCompWrapper>
-));