feat: compatibility with older js widget

Signed-off-by: lileirjyb <[email protected]>

Author: lilei946

packages/hap-packager/src/common/shared.js

@@ -228,6 +228,11 @@ function populateWidgetFields(widgetsObj) {
         `WARN: manifest.json 文件中 widgets 字段 ${key} 缺少 type 属性，默认设置为 js`
       )
     }
+    if (widgetsObj[key].type === 'js' && widgetsObj[key].minCardPlatformVersion) {
+      // 写了 minCardPlatformVersion 字段
+      // 赋值给 minPlatformVersion（兼容旧引擎），引导引擎升级
+      widgetsObj[key].minPlatformVersion = widgetsObj[key].minCardPlatformVersion
+    }
   })
 }
 

packages/hap-packager/src/plugins/card-plugin.js

@@ -38,7 +38,7 @@ class CardPlugin {
           stage: Compilation.PROCESS_ASSETS_STAGE_ADDITIONAL
         },
         () => {
-          let { pathSrc } = this.options
+          let { pathSrc, isCardMinVersion } = this.options
           pathSrc = pathSrc.replace(/\\/g, '/')
           const moduleGraph = compilation.moduleGraph
           for (const chunk of compilation.chunks) {
@@ -52,7 +52,7 @@ class CardPlugin {
                 request,
                 pathSrc
               )
-              const templateRes = {
+              let templateRes = {
                 [CARD_ENTRY]: {}
               }
               const styleRes = {}
@@ -65,16 +65,20 @@ class CardPlugin {
                 pathSrc,
                 bundleFilePath
               )
-              let handledTemplateCardRes
+
               if (this.isLiteCard(entryRawRequest)) {
-                handledTemplateCardRes = postHandleLiteCardRes(templateRes)
+                templateRes = postHandleLiteCardRes(templateRes)
+              } else if (isCardMinVersion) {
+                // 快应用 2.0 标准的 JS 卡，输出 .template.json 和 .css.json
+                templateRes = postHandleJSCardRes(templateRes)
               } else {
-                handledTemplateCardRes = postHandleJSCardRes(templateRes)
+                // 非快应用 2.0 标准的 JS 卡，不输出 .template.json 和 .css.json
+                continue
               }
 
               // 用于修改 template 的 key 的 stringify 的顺序，type 放第一个，children 放最后一个
               let templateKeys = []
-              recordKeys(handledTemplateCardRes, templateKeys)
+              recordKeys(templateRes, templateKeys)
 
               templateKeys = [...new Set(templateKeys.sort())]
                 .filter(
@@ -85,15 +89,15 @@ class CardPlugin {
               templateKeys.unshift('type', 'template', 'data')
 
               // 自定义组件 template 抽取成独立 JSON —— 卡片不采用该方式
-              // Object.keys(handledTemplateCardRes).forEach((key) => {
-              //   const res = handledTemplateCardRes[key]
+              // Object.keys(templateRes).forEach((key) => {
+              //   const res = templateRes[key]
               //   const fileName = key === CARD_ENTRY ? templateFileName : `${key}.template.json`
               //   const templateJsonStr = JSON.stringify(res, templateKeys)
               //   compilation.assets[fileName] = new ConcatSource(templateJsonStr)
               // })
 
               // 处理 template
-              const templateJsonStr = JSON.stringify(handledTemplateCardRes, templateKeys)
+              const templateJsonStr = JSON.stringify(templateRes, templateKeys)
               compilation.assets[templateFileName] = new ConcatSource(templateJsonStr)
 
               // 处理 css

packages/hap-packager/src/webpack.post.js

@@ -48,7 +48,8 @@ function postHook(webpackConf, defaultsOptions, quickappConfig = {}) {
     subpackages,
     workers,
     originType,
-    useTreeShaking
+    useTreeShaking,
+    isCardMinVersion
   } = defaultsOptions
 
   const manifestObj = readJson(path.join(pathSrc, 'manifest.json'))
@@ -125,10 +126,12 @@ function postHook(webpackConf, defaultsOptions, quickappConfig = {}) {
     )
   }
 
+  if (isCardMinVersion) {
+    // 如果工程中有卡片配置为快应用 2.0 卡片，则使用插件抽取 template 和 style 的 json
+    webpackConf.plugins.push(new CardScriptHandlePlugin({ pathSrc }), new RemoveModulesPlugin())
+  }
   webpackConf.plugins.push(
-    new CardScriptHandlePlugin({ pathSrc }),
-    new RemoveModulesPlugin(),
-    new CardPlugin({ pathSrc }),
+    new CardPlugin({ pathSrc, isCardMinVersion }),
     // 框架Handler包装
     new HandlerPlugin({
       pathSrc: pathSrc,

packages/hap-toolkit/src/gen-webpack-conf/index.js

@@ -23,7 +23,7 @@ import {
 import { name, postHook as packagerPostHook } from '@hap-toolkit/packager'
 import { postHook as xvmPostHook } from '@hap-toolkit/dsl-xvm'
 import ManifestWatchPlugin from '../plugins/manifest-watch-plugin'
-import { resolveEntries } from '../utils'
+import { resolveEntries, resolveCardMinVersion } from '../utils'
 import getDevtool from './get-devtool'
 import {
   getConfigPath,
@@ -154,6 +154,8 @@ export default async function genWebpackConf(launchOptions, mode) {
   // 页面文件
   const entries = resolveEntries(manifest, SRC_DIR, cwd)
 
+  const isCardMinVersion = resolveCardMinVersion(manifest)
+
   // 环境变量
   const env = {
     // 平台：native
@@ -496,7 +498,8 @@ export default async function genWebpackConf(launchOptions, mode) {
         workers,
         cwd,
         originType: compileOptionsObject.originType,
-        ideConfig: launchOptions.ideConfig
+        ideConfig: launchOptions.ideConfig,
+        isCardMinVersion
       },
       quickappConfig
     )

packages/hap-toolkit/src/utils.js

@@ -126,3 +126,28 @@ export function resolveEntries(manifest, basedir, cwd) {
   }
   return entries
 }
+export function resolveCardMinVersion(manifest) {
+  if (!manifest.router) {
+    throw Error('manifest.json 中未配置路由！')
+  }
+  let isCardMinVersion = false
+  // 卡片配置
+  const widgetsConf = manifest.router.widgets || {}
+
+  for (let key in widgetsConf) {
+    if (!widgetsConf[key].type || widgetsConf[key].type === 'js') {
+      // 针对 JS 卡的兼容
+      if (widgetsConf[key].minCardPlatformVersion) {
+        // 任意有一个 JS 卡写了 minCardPlatformVersion 字段
+        isCardMinVersion = true
+      } else {
+        // 没有 JS 卡写 minCardPlatformVersion 字段，说明是旧的 JS 卡片包
+        if (!widgetsConf[key].minPlatformVersion) {
+          // 同时没有写 minPlatformVersion 字段，提示补齐 minCardPlatformVersion
+          throw new Error(`manifest.json 中 widgets 必须包含 minCardPlatformVersion 字段`)
+        }
+      }
+    }
+  }
+  return isCardMinVersion
+}