@cloudbase/lowcode-builder 1.3.12-alpha.3 → 1.3.12-alpha.4

package/lib/builder/mp/materials.js

@@ -146,9 +146,7 @@ async function installMaterials(ctx, projDir, usedComps, weapps) {
             comp.materialName = lib.name;
         });
     });
-    // Collection infomation from components to lib meta
-    const compositedLibs = materialLibs.filter((lib) => lib.isComposite && usedComps[lib.name]);
-    compositedLibs.map((lib) => {
+    materialLibs.map((lib) => {
         lib.dependencies = lib.dependencies || {};
         lib.components.map((cmp) => {
             cmp.meta.syncProps = {};
@@ -159,14 +157,18 @@ async function installMaterials(ctx, projDir, usedComps, weapps) {
                     cmp.meta.syncProps[prop] = syncProp || inputProp;
                 }
             }
-            cmp.meta.platforms = {
-                mp: {
-                    path: `${cmp.name}/index`,
-                },
-            };
-            lib.dependencies = { ...lib.dependencies, ...cmp.npmDependencies };
+            if (lib.isComposite) {
+                cmp.meta.platforms = {
+                    mp: {
+                        path: `${cmp.name}/index`,
+                    },
+                };
+                lib.dependencies = { ...lib.dependencies, ...cmp.npmDependencies };
+            }
         });
     });
+    // Collection infomation from components to lib meta
+    const compositedLibs = materialLibs.filter((lib) => lib.isComposite && usedComps[lib.name]);
     // #2 Generate composited libs
     await Promise.all(compositedLibs.map(async (lib) => {
         console.log(`Generate composited library ${lib.name}`);
@@ -311,7 +313,7 @@ async function generateCompositeComponent(ctx, compositedComp, compLibCommonReso
         },
     };
     // Generating file by template and data
-    await (0, generateFiles_1.default)(compositeCtx, pageFileData, `${templateDir}/component`, outDir);
+    await (0, generateFiles_1.default)(pageFileData, `${templateDir}/component`, outDir);
     // #3 writing lowcode files
     /**
      * 低码没有开放 index 类别，直接去掉

package/lib/builder/mp/util.js

@@ -200,8 +200,10 @@ function generateDataContainerListeners() {
         {
             trigger: 'onDataChange',
             jsCode: `({event})=>{
-      app.utils.set(event.currentTarget._scope, 'dataContext.data', event?.detail?.data);
-      app.utils.set(event.currentTarget._scope, 'dataContext.state', event?.detail?.state);
+      if(event.currentTarget) {
+        app.utils.set(event.currentTarget._scope, 'dataContext.data', event?.detail?.data);
+        app.utils.set(event.currentTarget._scope, 'dataContext.state', event?.detail?.state);
+      }
     }`,
             type: weapps_core_1.ActionType.Inline,
             data: {},
@@ -220,7 +222,7 @@ function getListenersHandlers(listeners, id, componentApi) {
         return {};
     const eventHandlers = {};
     listeners.forEach((l) => {
-        var _a, _b, _c;
+        var _a, _b, _c, _d, _e;
         const handlerName = (0, wxml_1.getMpEventHanlderName)(id, l.trigger, l);
         eventHandlers[handlerName] = eventHandlers[handlerName] || [];
         const params = generatedDynamicData(l.data);
@@ -243,6 +245,7 @@ function getListenersHandlers(listeners, id, componentApi) {
             key: l.key || '',
             handler,
             handlerModule: (_c = l.handler) === null || _c === void 0 ? void 0 : _c.moduleName,
+            sourceKey: `${((_d = l.handler) === null || _d === void 0 ? void 0 : _d.moduleName) || ''}:${((_e = l.handler) === null || _e === void 0 ? void 0 : _e.name) || ''}`,
             data: params.staticProps,
             boundData: params.boundProps,
             type: l.type,
@@ -273,9 +276,21 @@ function createDataBinds(ctx, widgets) {
         const { directives = {} } = xProps;
         setDataBind(dataBinds[id], '_waFor', directives.waFor);
         setDataBind(dataBinds[id], '_waIf', directives.waIf);
+        if (directives.waDisplay) {
+            let { type, value } = directives.waDisplay;
+            if (!type || type === 'static') {
+                type = weapps_core_1.PropBindType.expression;
+                value = `${JSON.stringify(value)}`;
+            }
+            setDataBind(dataBinds[id], '_waDisplay', {
+                ...directives.waDisplay,
+                type,
+                value,
+            });
+        }
         setDataBind(dataBinds[id], 'classList', xProps.classListBind);
         setDataBind(dataBinds[id], 'style', xProps.styleBind);
-        const { classList, style } = dataBinds[id];
+        const { classList, style, _waDisplay } = dataBinds[id];
         if (classList) {
             dataBinds[id].classList = {
                 ...classList,
@@ -283,12 +298,21 @@ function createDataBinds(ctx, widgets) {
             };
         }
         if (style) {
-            const styleExpression = `{...widgetProps.${id}.style, ...(\n${style === null || style === void 0 ? void 0 : style.expression}\n)}`;
+            const styleExpression = _waDisplay
+                ? `{...widgetProps.${id}.style, ...(\n${style === null || style === void 0 ? void 0 : style.expression}\n), display: (()=>{${_waDisplay === null || _waDisplay === void 0 ? void 0 : _waDisplay.imports}\n return (\n${_waDisplay === null || _waDisplay === void 0 ? void 0 : _waDisplay.expression}\n)})() ? undefined: 'none' }`
+                : `{...widgetProps.${id}.style, ...(\n${style === null || style === void 0 ? void 0 : style.expression}\n)}`;
             dataBinds[id].style = {
                 ...style,
                 expression: processCssUnit === 'rpx' ? `px2rpx(${styleExpression})` : styleExpression,
             };
         }
+        else if (_waDisplay) {
+            const styleExpression = `{...widgetProps.${id}.style,  display: (\n${_waDisplay === null || _waDisplay === void 0 ? void 0 : _waDisplay.expression}\n)? undefined: 'none' }`;
+            dataBinds[id].style = {
+                ..._waDisplay,
+                expression: processCssUnit === 'rpx' ? `px2rpx(${styleExpression})` : styleExpression,
+            };
+        }
         if (Object.keys(dataBinds[id]).length === 0) {
             delete dataBinds[id];
         }

package/lib/builder/mp/wxml.js

@@ -32,17 +32,36 @@ function generateWxml(ctx, widgets, docTag, wxmlDataPrefix, usingComponents, com
         ].concat(createXml(widgets)),
     };
     if (ctx.isPage) {
+        const { enablePageRoot } = ctx;
         const originElements = xmlJson.elements;
         // 登录校验: 向其最外层包裹一层block
         xmlJson.elements = [
             {
                 type: 'element',
-                name: 'block',
+                name: enablePageRoot ? 'view' : 'block',
                 attributes: {
+                    id: 'wd-page-root',
                     ['wx:if']: '{{weDaHasLogin}}',
                     ['data-weui-theme']: 'light',
                 },
-                elements: originElements,
+                elements: [
+                    ...originElements,
+                    /**
+                     * 可能需要依赖添加逻辑节点的方式
+                     * 来触发 page 的 ready
+                     * 目的是为了让 page 的 ready 在组件的 ready 之后
+                     */
+                    // {
+                    //   type: 'element',
+                    //   name: 'readyPlaceHoler',
+                    //   attributes: {
+                    //     ['bind:ready']: '_onReady',
+                    //   },
+                    //   elements: originElements,
+                    //   _order: Infinity,
+                    //   _parent: null,
+                    // },
+                ],
                 _order: -1,
                 _parent: null,
             },
@@ -164,6 +183,13 @@ function generateWxml(ctx, widgets, docTag, wxmlDataPrefix, usingComponents, com
             if ((_d = directives.waIf) === null || _d === void 0 ? void 0 : _d.value) {
                 node.attributes['wx:if'] = getAttrBind(directives.waIf, `${attrPrefix}._waIf`);
             }
+            /**
+             * 对于 hidden 的支持依赖组件透传对应的属性
+             * 为了兼容，采用 style merge 的方式
+             */
+            // if (directives.waDisplay?.value !== undefined && directives.waDisplay?.value !== true) {
+            //   node.attributes['hidden'] = getAttrBind(directives.waDisplay, `${attrPrefix}._waDisplay`, false, true);
+            // }
             if ((_e = directives.waFor) === null || _e === void 0 ? void 0 : _e.value) {
                 node.attributes['wx:for'] = getAttrBind(directives.waFor, `${wxmlDataPrefix.widgetProp}${id}${parentForNodes
                     .map((forNodeId) => `[${wxmlDataPrefix.forIndex}${forNodeId}]`)
@@ -368,10 +394,12 @@ function getUsedComponents(widgets, usedCmps = {}) {
     return usedCmps;
 }
 exports.getUsedComponents = getUsedComponents;
-function getAttrBind(dVale, widgetBind, isStaticResource) {
+function getAttrBind(dVale, widgetBind, isStaticResource, neg) {
     const { type, value } = dVale;
     const attrVal = type === weapps_core_1.PropBindType.prop ? value : widgetBind;
-    return isStaticResource ? `{{wxsUtils._getStaticResourceAttribute(${attrVal})}}` : `{{${attrVal}}}`;
+    return isStaticResource
+        ? `{{${neg ? '!' : ''}wxsUtils._getStaticResourceAttribute(${attrVal})}}`
+        : `{{${neg ? `!(${attrVal})` : `${attrVal}`}}}`;
 }
 function getGenericCompTagName(propName) {
     return `g--${propName}`;

package/lib/builder/util/common.d.ts

@@ -1,7 +1,7 @@
 import { IComponentInputProps, IComponentsInfoMap, IPackageJson } from '../types/common';
 import { IMaterialItem, IWeAppComponentInstance, IWeAppCode } from '@cloudbase/lowcode-generator/lib/weapps-core';
 export { getMetaInfoBySourceKey, isArray, isPlainObject, deepDeal, simpleDeepClone, deepDealSchema, getFileNameByUrl, } from '@cloudbase/lowcode-generator/lib/generator/util/common';
-export declare type PromiseResult<T> = Promise<[null, T] | [Error, null]>;
+declare type PromiseResult<T> = Promise<[null, T] | [Error, null]>;
 export declare function promiseWrapper<T>(p: Promise<T>): PromiseResult<T>;
 export declare function getCurrentPackageJson(): {
     name: any;

package/lib/builder/util/common.js

@@ -34,10 +34,6 @@ function promiseWrapper(p) {
     });
 }
 exports.promiseWrapper = promiseWrapper;
-// export function isEmpty(i: any): boolean {
-//   if (typeof i === 'string') return !i.trim()
-//   return R.isEmpty(i) || R.isNil(i) || Number.isNaN(i)
-// }
 function getCurrentPackageJson() {
     try {
         const { name, version } = fs_extra_1.default.readJSONSync(path_1.default.resolve(process.cwd(), 'package.json'));

package/lib/builder/util/generateFiles.d.ts

@@ -1,8 +1,7 @@
 /// <reference types="node" />
-import { IBuildContext } from '../mp/BuildContext';
 import { OutputType } from 'jszip';
 export declare const generatedFileContents: {};
-export default function generateFiles(ctx: IBuildContext, appFileData: any, srcDir: string, dstDir: string): Promise<string[]>;
+export default function generateFiles(appFileData: any, srcDir: string, dstDir: string): Promise<string[]>;
 export declare function writeFile(outFile: string, content: string): Promise<boolean>;
 export declare function removeFile(file: string): void;
 /**

package/lib/builder/util/generateFiles.js

@@ -35,7 +35,7 @@ const glob_1 = __importDefault(require("glob"));
 const jszip_1 = __importDefault(require("jszip"));
 const buffer_1 = require("buffer");
 exports.generatedFileContents = {}; // generated files for incrmental build
-async function generateFiles(ctx, appFileData, srcDir, dstDir) {
+async function generateFiles(appFileData, srcDir, dstDir) {
     const filesGenerated = [];
     // Generating file by template and data
     for (const file in appFileData) {
@@ -46,18 +46,6 @@ async function generateFiles(ctx, appFileData, srcDir, dstDir) {
             encoding: 'utf8',
         });
         let generatedCode = (0, lodash_1.template)(tplStr, { interpolate: /<%=([\s\S]+?)%>/ })(appFileData[file]);
-        // 混合模式下，引用公共路径要多增加一层，并加多一层命名
-        // 混合子包直接在对应目录上生成，而不采用替换的方式 @royhyang
-        // if (ctx?.isMixMode && ctx?.rootPath) {
-        //   generatedCode = generatedCode.replace(
-        //     /..\/..\/..\/common\//g,
-        //     '../../../../common/'
-        //   )
-        //   generatedCode = generatedCode.replace(
-        //     /..\/..\/..\/app\//g,
-        //     '../../../../app/'
-        //   )
-        // }
         const outFile = path_1.default.resolve(dstDir, outFileName.replace(/\.tpl$/, ''));
         if (await writeFile(outFile, generatedCode)) {
             filesGenerated.push(outFileName);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cloudbase/lowcode-builder",
-  "version": "1.3.12-alpha.3",
+  "version": "1.3.12-alpha.4",
   "description": "云开发 Tencent CloudBase Framework Low Code Plugin，将低码配置生成完整项目并一键部署云开发资源。",
   "author": "yhsunshining@gmail.com",
   "homepage": "https://github.com/TencentCloudBase/cloudbase-framework#readme",
@@ -38,8 +38,8 @@
     "url": "https://github.com/TencentCloudBase/cloudbase-framework/issues"
   },
   "dependencies": {
-    "@cloudbase/cals": "^0.5.11",
-    "@cloudbase/lowcode-generator": "^1.3.6",
+    "@cloudbase/cals": "workspace:^",
+    "@cloudbase/lowcode-generator": "workspace:^",
     "axios": "^0.21.0",
     "browserfs": "^1.4.3",
     "browserify-zlib": "^0.2.0",

package/template/html/index.html.ejs

@@ -19,7 +19,7 @@
     <% cssStyles.forEach(function(styleUrl){%>
     <link type="text/css" rel="stylesheet" href="<%=styleUrl %>" />
     <% })%> <% if(cdnEndpoints.aegis){ %>
-    <script crossorigin="anonymous" src="<%= cdnEndpoints.aegis %>/aegis/aegis-sdk/latest/aegis.min.js?v=1"></script>
+    <script crossorigin="anonymous" src="<%= cdnEndpoints.aegis %>/aegis-sdk/latest/aegis.min.js"></script>
     <script>
       <% if(!isAdminPortal){ %>
       const _aegis = new Aegis({
@@ -386,7 +386,75 @@
   </head>
 
   <body data-weui-theme="light">
-    <div id="root" class="main-wrap"></div>
+    <div id="root" class="main-wrap">
+      <% if(enableStaticLoading){ %>
+      <style type="text/css">
+        .weda-loading-container {
+          position: fixed;
+          left: 0;
+          top: 0;
+          width: 100%;
+          display: flex;
+          justify-content: center;
+          align-items: center;
+          flex-direction: column;
+          height: 100%;
+          padding: 0 20px;
+        }
+        .weda-loading-container .logo {
+          width: 100%;
+          display: flex;
+          justify-content: center;
+          text-align: center;
+          margin-bottom: 50px;
+        }
+
+        .weda-loading-container .sp {
+          width: 48px;
+          height: 48px;
+        }
+
+        .weda-loading-container .sp-circle {
+          border: 6px rgba(0, 82, 217, 0.25) solid;
+          border-top: 6px rgba(0, 82, 217, 1) solid;
+          border-radius: 50%;
+          -webkit-animation: spCircRot 0.6s infinite linear;
+          animation: spCircRot 0.6s infinite linear;
+        }
+        @-webkit-keyframes spCircRot {
+          from {
+            -webkit-transform: rotate(0deg);
+          }
+          to {
+            -webkit-transform: rotate(359deg);
+          }
+        }
+        @keyframes spCircRot {
+          from {
+            transform: rotate(0deg);
+          }
+          to {
+            transform: rotate(359deg);
+          }
+        }
+      </style>
+      <div class="weda-loading-container">
+        <div class="logo">
+          <div class="sp sp-circle"></div>
+        </div>
+        <div class="text">初始化中...</div>
+        <script>
+          const ua = navigator.userAgent.toLowerCase();
+          if (ua.indexOf('wxwork') !== -1 && /[?&]code=/.test(location.search) && /[?&]state=/.test(location.search)) {
+            var el = document.querySelector('#root .weda-loading-container>.text');
+            if (el) {
+              el.innerHTML = '数据加载中...';
+            }
+          }
+        </script>
+      </div>
+      <% }%>
+    </div>
     <% jsApis.forEach(function(jsApi){%>
     <script src="<%=jsApi %>"></script>
     <% })%> <% if(canUseVite){ %>
@@ -453,7 +521,7 @@
       crossorigin="anonymous"
       src="<%=
         cdnEndpoints.cdngo
-      %>/lcap/lcap-resource-cdngo/-/release/_npm/@cloudbase/weda-cloud-sdk@1.0.19/dist/h5.browser.js"
+      %>/lcap/lcap-resource-cdngo/-/release/_npm/@cloudbase/weda-cloud-sdk@1.0.27-alpha.0/dist/h5.browser.js"
     ></script>
     <script>
       // zxing polifill
@@ -475,7 +543,7 @@
       crossorigin
       src="<%=
       cdnEndpoints.cdngo
-      %>/lcap/lcap-resource-cdngo/-/0.1.4/_files/static/weda-render/main.2895317effcdaa894b2d.bundle.js"
+      %>/lcap/lcap-resource-cdngo/-/0.1.4/_files/static/weda-render/main.051bed8f584a31b92c63.bundle.js"
     ></script>
   </body>
 </html>

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

@@ -4,6 +4,7 @@ import { createComputed, formatEnum, enumOptions } from '<%= subLevelPath %>../c
 import appGlobal from '<%= subLevelPath %>../app/app-global'
 import { createDataset } from '<%= subLevelPath %>../datasources/index'
 import lodashGet from 'lodash.get';
+import config from '<%= subLevelPath %>../common/config';
 
 
 <%= importor.state? `import state from '../lowcode/state'` : "const state = {}" %>
@@ -25,11 +26,13 @@ export const $w = new Proxy(
 
 function createGlboalApi() {
   const mpApp = createMpApp({
-    appConfig: <%= appConfig %>
+    appConfig: {
+      staticResourceDomain: config.domain,
+      ...(<%= appConfig %>)
+    },
   });
-  const globalAPI = {
-    id: '<%= appId %>',
-    domain: '<%= domain %>',
+  const globalAPI = Object.assign(mpApp, {
+    domain: config.domain,
     pages: {},
     session: {
       //configure: sdk.configure,
@@ -45,7 +48,7 @@ function createGlboalApi() {
       return $page.invokeComponentMethod(params)
     },
     // ... other sdk apis & apis from mp
-  } // The global api exposed to lowcode
+  }) // The global api exposed to lowcode
 
   globalAPI.__internal__.enumOptions = enumOptions
   globalAPI.utils.formatEnum = formatEnum

package/template/mp/app.js

@@ -83,20 +83,43 @@ setConfig({
 })
 
 App({
-  onLaunch(options) {
+  _query: {},
+  globaldata: {
+    _beforeCustomLaunchPromise: null
+  },
+  async beforeCustomLaunch(query) {
+    if(!this.globaldata?._beforeCustomLaunchPromise){
+      if(!this.globaldata) {
+        this.globaldata = {}
+      }
+      this.globaldata._beforeCustomLaunchPromise = new Promise(async (resolve)=>{
+        try {
+          EXTRA_API.setParams('$global', query || {})
+          await createStateDataSourceVar('$global', generateParamsParser({ app, $page: {} }));
+        } catch (e) {
+          throw e;
+        } finally {
+          resolve()
+        }
+      })
+    }
+    return this.globaldata._beforeCustomLaunchPromise
+  },
+  async onLaunch(options) {
     this.app = app
     const onLaunch = lifeCycle.onLaunch || lifeCycle.onAppLaunch
     let { query = {} } = options
-    EXTRA_API.setParams('$global', query)
-    createStateDataSourceVar('$global', generateParamsParser({ app }))
+    this._query = query
 
+    await this.beforeCustomLaunch(query)
     onLaunch && onLaunch.call(this, options)
     // 初始私有全局数据
     this.$$global = {
       homePageId: '<%= appConfig.homePageId %>'
     }
   },
-  onShow(options) {
+  async onShow(options) {
+    await this.beforeCustomLaunch(this._query)
     const fn = lifeCycle.onShow || lifeCycle.onAppShow
     fn && fn.call(this, options)
   },

package/template/mp/app.wxss

@@ -2,9 +2,10 @@
 page {
   /* 修复小程序 Picker 组件滑动体验问题 */
   touch-action: pan-y;
+  box-sizing: border-box;
 }
 
-page view, page element, page text, page image {
+page, page view, page element, page text, page image {
   box-sizing: border-box;
 }
 

package/template/mp/common/config.js

@@ -0,0 +1,9 @@
+/**
+ * require to be commonjs
+ */
+module.exports = {
+  isPrivate: <%=isPrivateMode%>,
+  domain: '<%=domain%>',
+  endpointType: '<%=endpointType%>',
+  tcbApiOrigin: '<%= endpointType === `tcb-api` && isPrivateMode && domain ? `https://${domain}` : `` %>'
+}

package/template/mp/common/config.wxs

@@ -0,0 +1,3 @@
+module.exports = {
+  domain: '<%=domain%>',
+};

package/template/mp/common/util.js

@@ -33,11 +33,13 @@ export function generateDataContext(widget) {
   while (widget?._scope) {
     const current = widget;
     // 此处采用代理的方式，是为了可以获取到最新的 _scope.dataContext 防止 dataContext 引用被重新赋值
-    Object.defineProperty(dataContext, current._scope.id, {
-      get() {
-        return current._scope.dataContext;
-      },
-    });
+    if(current?._scope?.id){
+      Object.defineProperty(dataContext, current._scope.id, {
+        get() {
+          return current?._scope?.dataContext;
+        },
+      });
+    }
     widget = widget.parent;
   }
   return dataContext;
@@ -64,14 +66,19 @@ export function createEventHandlers(
       const currentTarget = !!event?.currentTarget?.id ? getWidget(owner.widgets, event.currentTarget.id) : undefined;
       event.target = target;
       event.currentTarget = currentTarget;
-      const [prefix = ''] = name.split('$');
+      const [prefix = '', trigger] = name.split('$');
       // The page event handler
       const forContext = (!!currentTarget && generateForContextOfWidget(currentTarget)) || {};
       const { lists = [], forItems = {} } = forContext;
       const dataContext = untracked(() => generateDataContext(currentTarget));
       const $w = untracked(() => generateWidgetAPIContext(owner?.__internal__?.$w, currentTarget, forContext));
 
+      const currentPageId = app.__internal__?.activePage?.id
       listeners.forEach(async (l) => {
+        if(currentPageId && owner.id && currentPageId !== owner.id) {
+          console.error(`Action error: [${trigger}:${l.key}] 页面生命周期结束，链式调用中断`);
+          return ;
+        }
         let { data = {}, boundData = {} } = l;
         data = { ...data };
         try {
@@ -79,16 +86,16 @@ export function createEventHandlers(
             set(data, k, boundData[k].call(owner, owner, lists, forItems, event, dataContext, $w));
           }
           let res = await l.handler.call(owner, { event, data });
-          let eventName = prefix && l.key ? `${prefix}$${l.key}_success` : '';
+          let eventName = prefix && l.key ? `${prefix}$${l.key}${(l.sourceKey !== 'platform:utils.If') ? '_success' : (res ? '_success' : '_fail')}` : '';
           self[eventName] &&
             self[eventName]({
               ...event,
-              detail: res,
+              detail: l.sourceKey === 'platform:utils.If' ? event.detail : res,
             });
         } catch (e) {
           let eventName = l.key ? `${prefix}$${l.key}_fail` : '';
           if (self[eventName]) {
-            console.error(`事件响应失败`, e);
+            console.error(`Action error: [${trigger}:${l.key}]`, e);
             await self[eventName]({
               ...event,
               detail: e,

package/template/mp/common/utils.wxs

@@ -1,6 +1,8 @@
+var config = require('./config.wxs')
+
 function getStaticResourceAttribute(staticUrl) {
   if (staticUrl && staticUrl[0] == '/') {
-    var domain = '<%=domain%>'
+    var domain = config.domain
     return 'https://' + domain + staticUrl;
   }
   return staticUrl