feat(miniapp): migrate transformAppConfig method to shared

packages/miniapp-builder-shared/src/index.js

@@ -5,6 +5,7 @@ const pathHelper = require('./pathHelper');
 const platformMap = require('./platformMap');
 const constants = require('./constants');
 const autoInstallNpm = require('./autoInstallNpm');
+const { transformAppConfig, transformPageConfig } = require('./transformConfig');
 
 module.exports = {
   filterNativePages,
@@ -13,5 +14,7 @@ module.exports = {
   pathHelper,
   platformMap,
   constants,
-  autoInstallNpm
+  autoInstallNpm,
+  transformAppConfig,
+  transformPageConfig
 };

packages/rax-miniapp-config-webpack-plugin/src/adaptConfig.js → packages/miniapp-builder-shared/src/transformConfig/adaptConfig.js

@@ -1,4 +1,4 @@
-const { constants: { MINIAPP, WECHAT_MINIPROGRAM, BYTEDANCE_MICROAPP, QUICKAPP } } = require('miniapp-builder-shared');
+const { MINIAPP, WECHAT_MINIPROGRAM, BYTEDANCE_MICROAPP, QUICKAPP } = require('../constants');
 
 const configKeyMap = {
   [MINIAPP]: {
@@ -85,7 +85,7 @@ const configValueMap = {
   }
 };
 
-module.exports = function adaptConfig(originalConfig, property, target) {
+module.exports = function adaptConfig(originalConfig = {}, property, target) {
   const config = {};
   const configKeyAdapter =
     configKeyMap[target] && configKeyMap[target][property];

packages/rax-miniapp-config-webpack-plugin/src/transformAppConfig.js → packages/miniapp-builder-shared/src/transformConfig/index.js

@@ -1,9 +1,8 @@
 const { relative } = require('path');
-const adaptAppConfig = require('./adaptConfig');
-const handleIcon = require('./handleIcon');
-const { pathHelper: { normalizeOutputFilePath }} = require('miniapp-builder-shared');
+const adaptConfig = require('./adaptConfig');
+const { normalizeOutputFilePath } = require('../pathHelper');
 
-module.exports = function transformAppConfig(outputPath, originalAppConfig, target, subPackages) {
+function transformAppConfig(originalAppConfig, target, { subPackages = false, projectType = 'spa' }) {
   const appConfig = {};
   for (let configKey in originalAppConfig) {
     const config = originalAppConfig[configKey];
@@ -13,32 +12,35 @@ module.exports = function transformAppConfig(outputPath, originalAppConfig, targ
         // filter routes and applications
         break;
       case 'window':
-        appConfig[configKey] = adaptAppConfig(config, 'window', target);
+        appConfig[configKey] = adaptConfig(config, 'window', target);
         break;
       case 'tabBar':
         // Handle tab item
         if (config.items) {
           config.items = config.items.map(itemConfig => {
             const { icon, activeIcon, path: itemPath, pageName, ...others } = itemConfig;
-            const newItemConfig = {};
-            if (icon) {
-              newItemConfig.icon = handleIcon(icon, outputPath);
-            }
-            if (activeIcon) {
-              newItemConfig.activeIcon = handleIcon(activeIcon, outputPath);
-            }
+            const newItemConfig = {
+              icon,
+              activeIcon
+            };
             if (!itemConfig.pagePath) {
-              const targetRoute = originalAppConfig.routes.find(({ path }) =>
-                path === itemPath || path === pageName
-              );
+              const targetRoute = originalAppConfig.routes.find(({ path, name }) => {
+                if (projectType === 'spa') { // For miniapp
+                  return path === itemPath || path === pageName;
+                } else if (projectType === 'mpa') { // For FRM
+                  return name === pageName;
+                } else {
+                  return false;
+                }
+              });
               if (targetRoute) {
                 newItemConfig.pagePath = targetRoute.source;
               }
             }
-            return adaptAppConfig(Object.assign(newItemConfig, others), 'items', target);
+            return adaptConfig(Object.assign(newItemConfig, others), 'items', target);
           });
         }
-        appConfig[configKey] = adaptAppConfig(config, 'tabBar', target);
+        appConfig[configKey] = adaptConfig(config, 'tabBar', target);
         break;
       case 'subAppRoot':
         appConfig.root = config;
@@ -55,4 +57,13 @@ module.exports = function transformAppConfig(outputPath, originalAppConfig, targ
   }
 
   return appConfig;
+}
+
+function transformPageConfig(route = {}, target) {
+  return adaptConfig(route.window, 'window', target);
+}
+
+module.exports = {
+  transformAppConfig,
+  transformPageConfig
 };

packages/rax-miniapp-config-webpack-plugin/src/index.js

@@ -1,9 +1,9 @@
-const transformAppConfig = require('./transformAppConfig');
 const { join } = require('path');
 const { ensureDirSync } = require('fs-extra');
 const safeWriteFile = require('./safeWriteFile');
-const adaptConfig = require('./adaptConfig');
 const transformNativeConfig = require('./transformNativeConfig');
+const processIconFile = require('./processIconFile');
+const { transformAppConfig, transformPageConfig } = require('miniapp-builder-shared');
 
 const PluginName = 'MiniAppConfigPlugin';
 
@@ -25,12 +25,13 @@ module.exports = class MiniAppConfigPlugin {
     });
 
     function transformConfig(compilation, callback) {
-      const config = transformAppConfig(outputPath, appConfig, target);
+      const config = transformAppConfig(appConfig, target);
+      processIconFile(config, outputPath);
       if (subPackages) {
         // Transform subpackages
         config.subPackages = subAppConfigList
           .filter(subAppConfig => !subAppConfig.miniappMain)
-          .map(subAppConfig => transformAppConfig(outputPath, subAppConfig, target, subPackages));
+          .map(subAppConfig => transformAppConfig(subAppConfig, target, { subPackages }));
 
         if (subPackages.shareMemory) {
           config.subPackageBuildType = 'shared';
@@ -46,7 +47,8 @@ module.exports = class MiniAppConfigPlugin {
           subAppConfig.routes.map((route) => {
             if (route && route.window) {
               ensureDirSync(outputPath);
-              safeWriteFile(join(outputPath, route.source + '.json'), adaptConfig(route.window, 'window', target), true);
+              const pageConfig = transformPageConfig(route.window, 'window', target);
+              safeWriteFile(join(outputPath, route.source + '.json'), pageConfig, true);
             }
             if (route && route.miniappPreloadRule) {
               config.preloadRule[route.source] = route.miniappPreloadRule;
@@ -58,7 +60,8 @@ module.exports = class MiniAppConfigPlugin {
         appConfig.routes.map((route) => {
           if (route && route.window) {
             ensureDirSync(outputPath);
-            safeWriteFile(join(outputPath, route.source + '.json'), adaptConfig(route.window, 'window', target), true);
+            const pageConfig = transformPageConfig(route.window, 'window', target);
+            safeWriteFile(join(outputPath, route.source + '.json'), pageConfig, true);
           }
         });
       }

packages/rax-miniapp-config-webpack-plugin/src/processIconFile.js

@@ -0,0 +1,37 @@
+const { dirname, join } = require('path');
+const { copy, existsSync, ensureDirSync, unlinkSync } = require('fs-extra');
+
+function isUrl(src) {
+  return /^(https?:)?\/\//.test(src);
+}
+
+module.exports = function processIconFile(appConfig, outputPath) {
+  const iconFiles = [];
+  if (appConfig.tabBar) {
+    const items = appConfig.tabBar.items;
+    if (items) {
+      items.forEach(itemConfig => {
+        const { icon, activeIcon } = itemConfig;
+        if (icon) {
+          iconFiles.push(icon);
+        }
+        if (activeIcon) {
+          iconFiles.push(activeIcon);
+        }
+      });
+    }
+  }
+  iconFiles.forEach(iconFile => {
+    if (!isUrl(iconFile)) {
+      const sourcePath = join(process.cwd(), 'src', iconFile);
+      if (existsSync(sourcePath)) {
+        const distPath = join(outputPath, iconFile);
+        ensureDirSync(dirname(distPath));
+        if (existsSync(distPath)) {
+          unlinkSync(distPath);
+        }
+        copy(sourcePath, distPath);
+      }
+    }
+  });
+};