@cloudbase/lowcode-builder 1.1.10 → 1.2.0

package/lib/builder/h5/generate.d.ts

@@ -1,12 +1,13 @@
 import { BuildAppProps } from '@cloudbase/lowcode-generator';
+import { IPlatformApp } from '@cloudbase/cals';
 import { BuildType } from '../types/common';
 /**
  * 该函数从 @govcloud/generate 取到需要的模版文件
  */
 export declare function generateProjectFiles(buildData: BuildAppProps): Promise<void>;
-export declare function generateHTML({ appId, appBuildDir, jsApis, mode, devTool, isBuildApp, buildTypeList, }: {
+export declare function generateHTML({ appId, appBuildDir, externalResources, mode, devTool, isBuildApp, buildTypeList, }: {
     appId: string;
-    jsApis: string[];
+    externalResources: Required<IPlatformApp>['externalResources'];
     appBuildDir: string;
     mode: string;
     devTool: string;

package/lib/builder/h5/generate.js

@@ -7,6 +7,7 @@ exports.generateThemeVarsFile = exports.handleAssets = exports.generateHTML = ex
 const lowcode_generator_1 = require("@cloudbase/lowcode-generator");
 const generateFiles_1 = require("../util/generateFiles");
 const path_1 = __importDefault(require("path"));
+const cals_1 = require("@cloudbase/cals");
 const util_1 = require("../util");
 const common_1 = require("../util/common");
 const webpack_1 = require("../service/webpack");
@@ -24,16 +25,31 @@ async function generateProjectFiles(buildData) {
     }));
 }
 exports.generateProjectFiles = generateProjectFiles;
-async function generateHTML({ appId, appBuildDir, jsApis, mode, devTool, isBuildApp, buildTypeList, }) {
+async function generateHTML({ appId, appBuildDir, externalResources = [], mode, devTool, isBuildApp, buildTypeList, }) {
     const templatePath = path_1.default.join(config_1.appTemplateDir, 'html', 'index.html.ejs');
     const dstFilePath = path_1.default.join(appBuildDir, 'index.html');
     const packageTpl = await fs_extra_1.default.readFile(templatePath, { encoding: 'utf8' });
+    const jsApis = [];
+    const cssStyles = [];
+    for (let externalResource of externalResources) {
+        switch (externalResource.type) {
+            case cals_1.EExternalResourceType.JSUrl: {
+                jsApis.push(externalResource.url || '');
+                break;
+            }
+            case cals_1.EExternalResourceType.CSSUrl: {
+                cssStyles.push(externalResource.url || '');
+                break;
+            }
+        }
+    }
     await fs_extra_1.default.writeFile(dstFilePath, (0, lodash_1.template)(packageTpl)({
         appId,
         title: '',
         desc: 'WeDa构建的应用',
         canUseVite: (0, util_1.canUseVite)(mode, devTool),
-        jsApis: (0, lodash_1.uniq)(jsApis),
+        jsApis: Array.from(new Set(jsApis.filter((item) => !!item))),
+        cssStyles: Array.from(new Set(cssStyles.filter((item) => !!item))),
         mode,
         isBuildApp,
         isAdminPortal: (0, common_2.buildAsAdminPortalByBuildType)(buildTypeList),

package/lib/builder/h5/index.js

@@ -105,6 +105,7 @@ async function buildH5App({ appKey, buildDir, dependencies, i18nConfig, extraDat
         await (0, generate_1.generateThemeVarsFile)(mainAppData.themeVars, h5BuildDir);
         // 生成 webpack 配置
         const webpackConfigPath = await (0, webpack_1.runWebpackCore)({
+            cals,
             appKey,
             mainAppData,
             subAppDataList,

package/lib/builder/h5/webpack.d.ts

@@ -1,11 +1,13 @@
 import { IWebRuntimeAppData } from '@cloudbase/lowcode-generator/lib/weapps-core';
 import { BuildAppProps } from '../core/index';
+import { IPlatformApp } from '@cloudbase/cals';
 interface IWebpackCoreProps extends BuildAppProps {
+    cals: IPlatformApp;
     appBuildDir: string;
     mpConfig: any;
     mainAppData: IWebRuntimeAppData;
     subAppDataList: IWebRuntimeAppData[];
     assets: string[];
 }
-export declare function runWebpackCore({ mainAppData, subAppDataList, appBuildDir, publicPath, mode, appKey, buildTypeList, mpConfig, assets, devTool, generateMpType, }: IWebpackCoreProps): Promise<string>;
+export declare function runWebpackCore({ cals, mainAppData, subAppDataList, appBuildDir, publicPath, mode, appKey, buildTypeList, mpConfig, assets, devTool, generateMpType, }: IWebpackCoreProps): Promise<string>;
 export {};

package/lib/builder/h5/webpack.js

@@ -4,7 +4,8 @@ exports.runWebpackCore = void 0;
 const common_1 = require("../types/common");
 const webpack_1 = require("../service/webpack");
 const generate_1 = require("./generate");
-async function runWebpackCore({ mainAppData, subAppDataList, appBuildDir, publicPath, mode = common_1.WebpackModeType.NONE, appKey, buildTypeList = [common_1.BuildType.WEB], mpConfig, assets = [], devTool = 'vite', generateMpType = common_1.GenerateMpType.APP, }) {
+const cals_1 = require("@cloudbase/cals");
+async function runWebpackCore({ cals, mainAppData, subAppDataList, appBuildDir, publicPath, mode = common_1.WebpackModeType.NONE, appKey, buildTypeList = [common_1.BuildType.WEB], mpConfig, assets = [], devTool = 'vite', generateMpType = common_1.GenerateMpType.APP, }) {
     console.time('runWebpackCore');
     console.time('webpackGenerate');
     const allAppDataList = subAppDataList.concat(mainAppData);
@@ -28,7 +29,10 @@ async function runWebpackCore({ mainAppData, subAppDataList, appBuildDir, public
     await (0, generate_1.generateHTML)({
         appId: mainAppData.id || appKey,
         appBuildDir,
-        jsApis: assets,
+        externalResources: (cals.externalResources || []).concat(assets.map((url) => ({
+            type: cals_1.EExternalResourceType.CSSUrl,
+            url,
+        }))),
         mode,
         devTool,
         isBuildApp: buildTypeList.includes(common_1.BuildType.APP),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cloudbase/lowcode-builder",
-  "version": "1.1.10",
+  "version": "1.2.0",
   "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.0",
-    "@cloudbase/lowcode-generator": "^1.1.5",
+    "@cloudbase/cals": "^0.5.1",
+    "@cloudbase/lowcode-generator": "^1.2.0",
     "axios": "^0.21.0",
     "browserfs": "^1.4.3",
     "browserify-zlib": "^0.2.0",

package/template/html/index.html.ejs

@@ -14,6 +14,10 @@
       rel="stylesheet"
       href="https://qbase.cdn-go.cn/lcap/lcap-resource-cdngo/-/0.1.4/_files/static/weda-render/main.ba91c21b0d605c84ac7f.css"
     />
+    <% cssStyles.forEach(function(styleUrl){%>
+    <link type="text/css" rel="stylesheet" href="<%=styleUrl %>" />
+    <% })%>
+
     <script crossorigin="anonymous" src="https://cdn-go.cn/aegis/aegis-sdk/latest/aegis.min.js?v=1"></script>
     <script>
       <% if(!isAdminPortal){ %>
@@ -40,9 +44,7 @@
     <% 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){%>
-    <script src="<%=jsApi %>"></script>
-    <% })%>
+    <% }%>
 
     <!-- 重置浏览器样式 -->
     <style type="text/css">
@@ -383,7 +385,9 @@
 
   <body data-weui-theme="light">
     <div id="root" class="main-wrap"></div>
-    <% if(canUseVite){ %>
+    <% jsApis.forEach(function(jsApi){%>
+    <script src="<%=jsApi %>"></script>
+    <% })%> <% if(canUseVite){ %>
     <script type="module" src="/src/index.jsx"></script>
     <% } %> <% if(!isAdminPortal){ %>
     <script src="/weda-config/weda-private.js"></script>
@@ -461,7 +465,7 @@
     ></script>
     <script
       crossorigin
-      src="https://qbase.cdn-go.cn/lcap/lcap-resource-cdngo/-/0.1.4/_files/static/weda-render/main.408037dbe5cfeca28aeb.bundle.js"
+      src="https://qbase.cdn-go.cn/lcap/lcap-resource-cdngo/-/0.1.4/_files/static/weda-render/main.1e31c84cddbb620d740f.bundle.js"
     ></script>
   </body>
 </html>