fix: route component should support the .node convention (#5212)

web-infra-dev · Jan 29, 2024 · b9425b1 · b9425b1
1 parent 104ceab
commit b9425b1
Show file tree

Hide file tree

Showing 5 changed files with 47 additions and 43 deletions.
diff --git a/.changeset/popular-knives-bake.md b/.changeset/popular-knives-bake.md
@@ -0,0 +1,6 @@
+---
+'@modern-js/app-tools': patch
+---
+
+fix: route component should support the `.node` convention
+fix: 路由组件应该支持 `.node` 约定
diff --git a/packages/solutions/app-tools/src/analyze/index.ts b/packages/solutions/app-tools/src/analyze/index.ts
@@ -11,7 +11,7 @@ import {
 import type { CliPlugin } from '@modern-js/core';
 import { cloneDeep } from '@modern-js/utils/lodash';
 import { printInstructions } from '../utils/printInstructions';
-import { generateRoutes } from '../utils/routes';
+import { generateRoutes, getPathWithoutExt } from '../utils/routes';
 import { emitResolvedConfig } from '../utils/config';
 import { getSelectedEntries } from '../utils/getSelectedEntries';
 import { AppTools, webpack } from '../types';
@@ -269,11 +269,10 @@ export default ({
             const hasAppConfig = moduleExports.some(
               e => e.n === APP_CONFIG_NAME,
             );
-            const generateLayoutPath = replaceWithAlias(
-              srcDirectory,
-              rootLayoutFile,
-              internalSrcAlias,
+            const generateLayoutPath = getPathWithoutExt(
+              replaceWithAlias(srcDirectory, rootLayoutFile, internalSrcAlias),
             );
+
             if (hasAppConfig) {
               imports.push({
                 value: generateLayoutPath,

diff --git a/packages/solutions/app-tools/src/analyze/nestedRoutes.ts b/packages/solutions/app-tools/src/analyze/nestedRoutes.ts
@@ -1,6 +1,7 @@
 import * as path from 'path';
 import { fs, normalizeToPosixPath } from '@modern-js/utils';
 import type { NestedRouteForCli } from '@modern-js/types';
+import { getPathWithoutExt } from '../utils/routes';
 import { JS_EXTENSIONS, NESTED_ROUTE } from './constants';
 import { hasAction, replaceWithAlias } from './utils';
 
@@ -10,11 +11,6 @@ const replaceDynamicPath = (routePath: string) => {
   return routePath.replace(/\[(.*?)\]/g, ':$1');
 };
 
-const getPathWithoutExt = (filename: string) => {
-  const extname = path.extname(filename);
-  return filename.slice(0, -extname.length);
-};
-
 export const getRouteId = (
   componentPath: string,
   routesDir: string,
@@ -165,10 +161,8 @@ export const walk = async (
 
   for (const item of items) {
     const itemPath = path.join(dirname, item);
-    const itemPathWithAlias = replaceWithAlias(
-      alias.basename,
-      itemPath,
-      alias.name,
+    const itemPathWithAlias = getPathWithoutExt(
+      replaceWithAlias(alias.basename, itemPath, alias.name),
     );
     const extname = path.extname(item);
     const itemWithoutExt = item.slice(0, -extname.length);

diff --git a/packages/solutions/app-tools/src/utils/routes.ts b/packages/solutions/app-tools/src/utils/routes.ts
@@ -8,4 +8,9 @@ const generateRoutes = async (appContext: IAppContext) => {
   await fs.outputFile(path.join(distDirectory, ROUTE_SPEC_FILE), output);
 };
 
-export { generateRoutes };
+const getPathWithoutExt = (filename: string) => {
+  const extname = path.extname(filename);
+  return filename.slice(0, -extname.length);
+};
+
+export { generateRoutes, getPathWithoutExt };
diff --git a/packages/solutions/app-tools/tests/analyze/__snapshots__/nestedRoutes.test.ts.snap b/packages/solutions/app-tools/tests/analyze/__snapshots__/nestedRoutes.test.ts.snap
@@ -3,16 +3,16 @@
 exports[`nested routes walk 1`] = `
 [
   {
-    "_component": "@_modern_js_src/layout.tsx",
+    "_component": "@_modern_js_src/layout",
     "children": [
       {
-        "_component": "@_modern_js_src/__auth/layout.tsx",
+        "_component": "@_modern_js_src/__auth/layout",
         "children": [
           {
-            "_component": "@_modern_js_src/__auth/__shop/layout.tsx",
+            "_component": "@_modern_js_src/__auth/__shop/layout",
             "children": [
               {
-                "_component": "@_modern_js_src/__auth/__shop/item/page.tsx",
+                "_component": "@_modern_js_src/__auth/__shop/item/page",
                 "children": undefined,
                 "id": "__auth/__shop/item/page",
                 "path": "item",
@@ -24,58 +24,58 @@ exports[`nested routes walk 1`] = `
             "type": "nested",
           },
           {
-            "_component": "@_modern_js_src/__auth/login/page.tsx",
+            "_component": "@_modern_js_src/__auth/login/page",
             "children": undefined,
             "id": "__auth/login/page",
             "path": "login",
             "type": "nested",
           },
         ],
-        "config": "@_modern_js_src/__auth/layout.config.ts",
+        "config": "@_modern_js_src/__auth/layout.config",
         "id": "__auth/layout",
         "isRoot": false,
-        "loader": "@_modern_js_src/__auth/layout.loader.tsx",
+        "loader": "@_modern_js_src/__auth/layout.loader",
         "type": "nested",
       },
       {
-        "_component": "@_modern_js_src/user/layout.tsx",
+        "_component": "@_modern_js_src/user/layout",
         "children": [
           {
-            "_component": "@_modern_js_src/user/$.tsx",
-            "action": "@_modern_js_src/user/$.data.ts",
-            "clientData": "@_modern_js_src/user/$.data.client.ts",
+            "_component": "@_modern_js_src/user/$",
+            "action": "@_modern_js_src/user/$.data",
+            "clientData": "@_modern_js_src/user/$.data.client",
             "config": "@_modern_js_src/user/$.config.ts",
-            "data": "@_modern_js_src/user/$.data.ts",
+            "data": "@_modern_js_src/user/$.data",
             "id": "user/$",
             "path": "*",
             "type": "nested",
           },
           {
-            "_component": "@_modern_js_src/user/[id]/page.tsx",
+            "_component": "@_modern_js_src/user/[id]/page",
             "children": undefined,
-            "data": "@_modern_js_src/user/[id]/page.data.ts",
+            "data": "@_modern_js_src/user/[id]/page.data",
             "id": "user/(id)/page",
             "path": ":id",
             "type": "nested",
           },
           {
-            "_component": "@_modern_js_src/user/page.tsx",
+            "_component": "@_modern_js_src/user/page",
             "children": undefined,
-            "config": "@_modern_js_src/user/page.config.ts",
+            "config": "@_modern_js_src/user/page.config",
             "id": "user/page",
             "index": true,
-            "loader": "@_modern_js_src/user/page.loader.ts",
+            "loader": "@_modern_js_src/user/page.loader",
             "type": "nested",
           },
           {
-            "_component": "@_modern_js_src/user/profile/layout.tsx",
+            "_component": "@_modern_js_src/user/profile/layout",
             "children": [
               {
-                "_component": "@_modern_js_src/user/profile/page.tsx",
+                "_component": "@_modern_js_src/user/profile/page",
                 "children": undefined,
                 "id": "user/profile/page",
                 "index": true,
-                "loader": "@_modern_js_src/user/profile/page.loader.ts",
+                "loader": "@_modern_js_src/user/profile/page.loader",
                 "type": "nested",
               },
             ],
@@ -85,36 +85,36 @@ exports[`nested routes walk 1`] = `
             "type": "nested",
           },
         ],
-        "config": "@_modern_js_src/user/layout.config.ts",
+        "config": "@_modern_js_src/user/layout.config",
         "id": "user/layout",
         "isRoot": false,
-        "loader": "@_modern_js_src/user/layout.loader.ts",
+        "loader": "@_modern_js_src/user/layout.loader",
         "path": "user",
         "type": "nested",
       },
       {
-        "_component": "@_modern_js_src/user.profile.name/layout.tsx",
+        "_component": "@_modern_js_src/user.profile.name/layout",
         "children": [
           {
-            "_component": "@_modern_js_src/user.profile.name/page.tsx",
+            "_component": "@_modern_js_src/user.profile.name/page",
             "children": undefined,
-            "config": "@_modern_js_src/user.profile.name/page.config.ts",
+            "config": "@_modern_js_src/user.profile.name/page.config",
             "id": "user.profile.name/page",
             "index": true,
             "type": "nested",
           },
         ],
-        "config": "@_modern_js_src/user.profile.name/layout.config.ts",
+        "config": "@_modern_js_src/user.profile.name/layout.config",
         "id": "user.profile.name/layout",
         "isRoot": false,
         "path": "user/profile/name",
         "type": "nested",
       },
     ],
-    "config": "@_modern_js_src/layout.config.ts",
+    "config": "@_modern_js_src/layout.config",
     "id": "layout",
     "isRoot": true,
-    "loader": "@_modern_js_src/layout.loader.ts",
+    "loader": "@_modern_js_src/layout.loader",
     "path": "/",
     "type": "nested",
   },