feat: support use name define mpa page name (#3906)

* feat: support use name define mpa page name

* fix: ts error

* chore: optimize code

* feat: add export source when parse entry

packages/build-app-helpers/package.json

@@ -23,4 +23,4 @@
     "fs-extra": "^8.1.0",
     "lodash": "^4.17.20"
   }
-}
+}

packages/build-app-helpers/src/getMpaEntries.ts

@@ -6,30 +6,58 @@ interface IOptions {
   target: string;
   appJsonPath: string;
 }
+
+interface IEntry {
+  entryPath: string;
+  entryName: string;
+  pageName: string;
+  source?: string;
+}
+
 // Get entries when exist app.json
-export default function (api, options?: IOptions) {
+export default function (api, options?: IOptions): IEntry[] {
   const { target, appJsonPath } = options || {};
   if (appJsonPath) {
-    return getEntriesByJson(target, appJsonPath);
+    return getEntriesByJson(api, target, appJsonPath);
   }
   return getEntriesByDir(api);
 }
 
-function getEntriesByJson(target, appJsonPath) {
+function getEntriesByJson(api, target, appJsonPath): IEntry[] {
+  const {
+    context: { rootDir },
+  } = api;
   const routes = getRoutesByAppJson(target, { appJsonPath });
   return routes.map((route) => {
-    const dir = path.dirname(route.source);
-    const pageName = path.parse(dir).name;
+    let pageName;
+    let entryName;
+    if (route.name) {
+      entryName = route.name;
+      pageName = route.name;
+    } else {
+      const dir = path.dirname(route.source);
+      pageName = path.parse(dir).name;
+      entryName = pageName.toLocaleLowerCase();
+    }
     return {
-      path: route.path,
-      entryName: pageName.toLowerCase(),
+      entryPath: getPageEntryByAppJson(rootDir, route.source),
+      entryName,
       pageName,
-      entryPath: route.source.replace(/\/?pages/, ''),
+      source: route.source
     };
   });
 }
 
-function getEntriesByDir(api: any) {
+function getPageEntryByAppJson(rootDir, source) {
+  const absolutePath = path.resolve(rootDir, 'src', source);
+  const targetExt = ['ts', 'tsx', 'js', 'jsx'].find(ext => fs.existsSync(`${absolutePath}.${ext}`));
+  if (!targetExt) {
+    throw new Error(`Cannot find target file ${absolutePath}.`);
+  }
+  return `${source}.${targetExt}`;
+}
+
+function getEntriesByDir(api: any): IEntry[] {
   const {
     context: { rootDir },
   } = api;
@@ -43,18 +71,18 @@ function getEntriesByDir(api: any) {
 
   const entries = pages.map((pageName) => {
     const entryName = pageName.toLocaleLowerCase();
-    const pageEntry = getPageEntry(pagesPath, pageName);
+    const pageEntry = getPageEntryByDir(pagesPath, pageName);
     if (!pageEntry) return null;
     return {
       entryName,
       pageName,
-      entryPath: `${pageName}/${pageEntry}`,
+      entryPath: `pages/${pageName}/${pageEntry}`,
     };
   }).filter(Boolean);
   return entries;
 }
 
-function getPageEntry(pagesPath: string, pageName: string) {
+function getPageEntryByDir(pagesPath: string, pageName: string) {
   const pagePath = path.join(pagesPath, pageName);
   const pageRootFiles = fs.readdirSync(pagePath);
   const appRegexp = /^app\.(t|j)sx?$/;

packages/build-app-helpers/src/getRoutesByAppJson.ts

@@ -4,6 +4,7 @@ interface IRoute {
   targets?: string[];
   source: string;
   path: string;
+  name?: string;
 }
 interface IStaticConfig {
   routes: IRoute[];

packages/build-app-helpers/src/index.ts

@@ -4,4 +4,3 @@ export { default as formatPath } from './formatPath';
 export { default as validation } from './validation';
 export { default as unionBy } from './unionBy';
 export { default as injectTransformRuntime } from './injectTransformRuntime';
-

packages/build-mpa-config/package.json

@@ -24,4 +24,4 @@
     "loader-utils": "^2.0.0",
     "@builder/app-helpers": "^1.0.2"
   }
-}
+}

packages/build-mpa-config/src/generateEntry.ts

@@ -6,8 +6,9 @@ function generateEntry({ framework, type, targetDir, pageEntry, entryName }) {
   // eslint-disable-next-line
   const entryCode = require(`./template/${framework}`).default({ type, resourcePath: `${formatPath(pageEntry)}`});
   const entryFolder = path.join(targetDir, 'mpaEntry');
-  ensureDirSync(entryFolder);
   const entryPath = path.join(entryFolder, `${entryName}.tsx`);
+  const entryDir = path.dirname(entryPath);
+  ensureDirSync(entryDir);
   writeFileSync(path.join(entryFolder, `${entryName}.tsx`), entryCode);
   return entryPath;
 }

packages/build-mpa-config/src/index.ts

@@ -4,7 +4,6 @@ import generateEntry from './generateEntry';
 
 interface IEntries {
   entryName: string;
-  pageName: string;
   entryPath: string;
 }
 
@@ -32,7 +31,7 @@ export const generateMPAEntries = (options: IConfigOptions) => {
   const parsedEntries = {};
   entries.forEach((entry) => {
     const { entryName, entryPath } = entry;
-    const pageEntry = path.join(rootDir, 'src/pages', entryPath);
+    const pageEntry = path.join(rootDir, 'src', entryPath);
     const useOriginEntry = /app\.(t|j)sx?$/.test(entryPath) || type === 'node';
     // icejs will config entry by api modifyUserConfig
 
@@ -64,11 +63,11 @@ const setMPAConfig = (config, options: IConfigOptions) => {
   const matchStrs = [];
 
   Object.keys(parsedEntries).forEach((entryKey) => {
-    const { entryName, pageName, finalEntry } = parsedEntries[entryKey];
+    const { entryName, entryPath, finalEntry } = parsedEntries[entryKey];
     config.entry(entryName).add(finalEntry);
 
     // get page paths for rule match
-    const matchStr = `src/pages/${pageName}`;
+    const matchStr = `src/${entryPath}`;
     matchStrs.push(formatPath(matchStr));
   });