@modern-js/app-tools 2.0.0-beta.4 → 2.0.0-beta.6

package/CHANGELOG.md

@@ -1,5 +1,319 @@
 # @modern-js/app-tools
 
+## 2.0.0-beta.6
+
+### Major Changes
+
+- dda38c9c3e: chore: v2
+
+### Minor Changes
+
+- df7ee2d: feat: runtime user config types extends
+  feat: runtime 用户配置类型扩展
+- edd1cfb1af: feat: modernjs Access builder compiler
+  feat: modernjs 接入 builder 构建
+- b710adb843: feat: extract the data loader
+  feat: 提取 data loader
+- bbe4c4ab64: feat: add @modern-js/plugin-swc
+
+  feat: 新增 @modern-js/plugin-swc 插件
+
+- e4558a0bc4: feat:
+
+  1. add `runBin` function
+  2. config internal plugins constants in the app/module/doc tools
+  3. add app/module/doc tools internal plugins
+
+  feat:
+
+  1. 添加 `runBin` 函数
+  2. 在 app/module/doc tools 里配置内部插件
+  3. 增加 app/module/doc tools 使用的插件常量
+
+- 543be9558e: feat: compile server loader and support handle loader request
+  feat: 编译 server loader 并支持处理 loader 的请求
+
+### Patch Changes
+
+- c9f912ca4d: feat(app-tools): improve build logs of dev and build command
+
+  feat(app-tools): 优化 dev 和 build 过程中的日志展示
+
+- 0078da4c80: fix: remove webpack oneof rule in new config, save in legacy mode.
+  fix: 在新模式下删除 webpack oneof 规则，兼容模式下保留
+- 103973cde9: fix: builder tools.webpackChain config args not match the Modernjs tools.webpackChain
+  fix: builder tools.webpackChain 配置传参无法匹配 Modernjs tools.webpackChain
+- 7879e8f711: refactor: remove enableModernMode config
+
+  refactor: 不再支持 enableModernMode 配置项
+
+- 0be536decc: fix(app-tools): html.template config not work
+
+  fix(app-tools): 修复 html.template 配置项不生效的问题
+
+- d4e8e6fb90: fix: modernjs dev server can't start normaly
+  fix: modernjs dev 服务端不能正常启动
+- 0b2d1ef02b: fix: repeat register `babel-plugin-lodash`
+  fix: 重复注册 `babel-plugin-lodash`
+- 217c43a057: fix: should generate path correctly for data loader
+  fix: 应该生成正确的路径给 data loader
+- 82cef85ed7: fix: specify builder compiler framework
+  fix: 指明 builder 构建时框架
+- 1eeb052: fix: support set entry with file-system based router
+  fix: 约定式路由支持设置 entry
+- e011faf484: fix: the esbuild watcher should be stoped when cli restart
+  fix: 当 cli 重启时，esbuild watcher 应该停止监听文件
+- 3e57f2bd58: feat: add document feature with plugin
+
+  feat: 增加 document 功能插件
+
+- 3941653375: fix: add esbuild to dependencies
+  fix: 将 esbuild 添加到依赖中
+- 33aeb51544: feat: add manifest field for router config
+  feat: 为 router 配置添加 manifest 字段
+- 85edee888c: feat(app-tools): support tools.htmlPlugin config
+
+  feat(app-tools): 支持 tools.htmlPlugin 配置项
+
+- 2e6031955e: fix: some optimizations for router and loader
+  fix: 一些 router 和 loader 的优化
+  q
+- 752480d: fix(app-tools): failed to copy public assets
+
+  fix(app-tools): 修复拷贝 public 下的静态文件失败的问题
+
+- a55b9656c4: fix: rename "loader routes" file to avoid influence ssr
+  fix: 重命名 loader routes 避免影响 ssr
+- 5402fdb0ca: feat(Builder): add output.disableTsChecker config
+
+  feat(Builder): 新增 output.disableTsChecker 配置项
+
+- dc8eeb9cbb: fix: clear distDirectory in prepare hook & inject data loader plugin to server
+  fix: 在 prepare hook 中清理 dist 目录，并且向 server 中注入 data loader plugin
+- cc971eabfc: refactor: move server plugin load logic in `@modern-js/core`
+  refactor：移除在 `@modern-js/core` 中的 server 插件加载逻辑
+- 5b9049f2e9: feat: inject async js chunk when streaming ssr
+  feat: streaming ssr 时, 注入 async 类型的 js chunk
+- d4a456659b: chore: rename plugin-jarvis to plugin-lint
+
+  chore: 重命名 plugin-jarvis 为 plugin-lint
+
+- 6bda14ed71: feat: refactor router with react-router@6.4
+
+  feat: 使用 react-router@6.4 重构路由模块
+
+- d36c6ee126: fix(app-tools): failed to run inspect command
+
+  fix(app-tools): 修复运行 inspect 命令失败的问题
+
+- 92004d1906: feat: support load chunks parallelly
+  feat: 支持并行加载 chunks
+- b8bbe036c7: feat: change type logic
+  feat: 修改类型相关的逻辑
+- 40ed5874c6: feat: inject css chunk into html for streaming ssr
+  feat: streaming ssr 返回的 html 注入 css chunk
+- af4422d67f: feat(builder): complete utils of tools.webpack
+
+  feat(builder): 补全 tools.webpack 提供的 utils 方法
+
+- 4293748b9d: fix: router config maybe not defined
+  fix: router 配置可能不存在
+- 87c1ff86b9: feat(app-tools): attach builder instance to appContext
+
+  feat(app-tools): 将 builder 实例挂载到 appContext 上
+
+- c258e34202: fix: add builder hooks `beforeBuild` params
+  fix: 新增 builder hooks `beforeBuild` 的参数
+- 3b3d709ee2: fix(app-tools): cli --analyze option not work
+
+  fix(app-tools): 修复 --analyze 命令行参数不生效的问题
+
+- 8b8e1bb571: feat: support nested routes
+  feat: 支持嵌套路由
+- f5178e19e0: fix(app-tools): dev.startUrl not work
+
+  fix(app-tools): 修复 dev.startUrl 不生效的问题
+
+- 88eb147ae1: fix(app-tools): builder's onBeforeCreateDevServer hook not work
+
+  fix(app-tools): 修复 builder 的 onBeforeCreateDevServer hook 无法触发的问题
+
+- 8c32dc4237: fix: builder should not be checked when apiOnly is true
+  fix: 当 apiOnly 为 true 时，builder 不应该被校验
+- a2c8cc3eb5: fix: change tools define userconfig type
+  fix: 修改工程定义的 UserConfig 类型
+- b7a96c35fc: fix(app-tools): loose CLI init options after restart
+
+  fix(app-tools): 修复重启 CLI 后丢失 init options 的问题
+
+- df62445d1b: fix: fix generateCode logic for windows
+  fix: 兼容 generateCode 的逻辑在 windows 平台
+- 7de97ae24f: fix: `deploy` command has't load `builder` instance
+  fix: `deploy` 命令没有加载 builder 实例
+- cce8ecee2d: fix: handle some `TODO` & `FIXME`, change some tests
+  fix: 处理一些 `TODO` 和 `FIXME`, 修改了一些 tests
+- c3b7de4bfb: fix(app-tools): dev.assetPrefix not work
+
+  fix(app-tools): 修复 dev.assetPrefix 配置项不生效的问题
+
+- 16a3441eea: fix(app-tools): remove duplicated port log
+
+  fix(app-tools): 修复 port 重复的日志输出两遍的问题
+
+- 92004d1906: fix: use loadable lazy instead of loadable
+  fix: 使用 loadable lazy 组件替代 loadable
+- ebf899f: feat(app-tools): support configure builder plugins
+
+  feat(app-tools): 支持配置 builder 插件
+
+- c677befc22: fix(app-tools): compat legacy resolve behavior
+
+  fix(app-tools): 兼容旧版本 node_modules 解析逻辑
+
+- f1b8e8a3da: fix(app-tools): failed to copy HTML from config/public dir
+
+  fix(app-tools): 修复从 config/public 拷贝 HTML 文件时可能出现编译错误的问题
+
+- 3f7cde5caa: fix: builder plugin setup can't get config
+  fix: builder 插件在 setup 阶段无法拿到 config
+- 99213e4bae: fix: process does't exit when exec command
+  fix: 修复执行命令时进程未退出的问题
+- b16fd964da: fix: `modern-js/app-tools` pass error config to builder.
+  fix: `modern-js/app-tools` 传递错误的 config 给 builder.
+- 16ef1a7c9b: fix(app-tools): should not increase port when restart
+
+  fix(app-tools): 修复 restart 时端口号会增加的问题
+
+- 7eefedd7ca: fix: add html-webpack-plugin `__internal__` options, for bottom template
+  fix: 为了 bottom template, 增加 `html-webpack-plugin` `__internal__` 配置项，
+- 14b712da84: fix: use consistent alias type and default value across packages
+
+  fix: 在各个包中使用一致的 alias 类型定义和默认值
+
+- Updated dependencies [c9f912ca4d]
+- Updated dependencies [95be7cc49c]
+- Updated dependencies [e439457a51]
+- Updated dependencies [4d1545f8c0]
+- Updated dependencies [4a7693fe6b]
+- Updated dependencies [2bc090c089]
+- Updated dependencies [ba5325731c]
+- Updated dependencies [f0abb2e82f]
+- Updated dependencies [f96a725211]
+- Updated dependencies [7879e8f711]
+- Updated dependencies [828f42f9ce]
+- Updated dependencies [060abd4553]
+- Updated dependencies [309cd71a1c]
+- Updated dependencies [c7456864a8]
+- Updated dependencies [c9e800d39a]
+- Updated dependencies [d4e8e6fb90]
+- Updated dependencies [0ff846fb56]
+- Updated dependencies [3cf9633195]
+- Updated dependencies [6604f1b8b3]
+- Updated dependencies [57077b2c64]
+- Updated dependencies [217c43a057]
+- Updated dependencies [d032d49e09]
+- Updated dependencies [6aca875011]
+- Updated dependencies [2ff6167be0]
+- Updated dependencies [287f298990]
+- Updated dependencies [15bf09d9c8]
+- Updated dependencies [423188db70]
+- Updated dependencies [fd2d652c03]
+- Updated dependencies [0c2d8dae31]
+- Updated dependencies [2edad29dd7]
+- Updated dependencies [85edee888c]
+- Updated dependencies [2e6031955e]
+- Updated dependencies [dc52ee8]
+- Updated dependencies [a2509bfbdb]
+- Updated dependencies [309f08bdf4]
+- Updated dependencies [3998875791]
+- Updated dependencies [752480d]
+- Updated dependencies [b827e35aba]
+- Updated dependencies [ab3924a70e]
+- Updated dependencies [3998875791]
+- Updated dependencies [ba86b8b711]
+- Updated dependencies [61f21d1e77]
+- Updated dependencies [7b7d12cf8f]
+- Updated dependencies [5402fdb0ca]
+- Updated dependencies [7efeed4]
+- Updated dependencies [2ae58176fe]
+- Updated dependencies [92f0eade39]
+- Updated dependencies [edd1cfb1af]
+- Updated dependencies [5d67c26cdb]
+- Updated dependencies [cc971eabfc]
+- Updated dependencies [5b9049f2e9]
+- Updated dependencies [83ac356e15]
+- Updated dependencies [a3af050486]
+- Updated dependencies [d4a456659b]
+- Updated dependencies [18360a38d7]
+- Updated dependencies [6bda14ed71]
+- Updated dependencies [0b314e6946]
+- Updated dependencies [92004d1906]
+- Updated dependencies [b8bbe036c7]
+- Updated dependencies [5911154129]
+- Updated dependencies [40ed5874c6]
+- Updated dependencies [af4422d67f]
+- Updated dependencies [705adc1dae]
+- Updated dependencies [f680410886]
+- Updated dependencies [87c1ff86b9]
+- Updated dependencies [d5a31df781]
+- Updated dependencies [dda38c9c3e]
+- Updated dependencies [4f277fe288]
+- Updated dependencies [102d32e4ba]
+- Updated dependencies [c258e34202]
+- Updated dependencies [812913ccdd]
+- Updated dependencies [7248342e4d]
+- Updated dependencies [568eab1e42]
+- Updated dependencies [8b8e1bb571]
+- Updated dependencies [3bbea92b2a]
+- Updated dependencies [ae71096d45]
+- Updated dependencies [73cd29dd9f]
+- Updated dependencies [cd5cdd9]
+- Updated dependencies [e06b9a2ec6]
+- Updated dependencies [b710adb843]
+- Updated dependencies [b7a96c35fc]
+- Updated dependencies [a23010138d]
+- Updated dependencies [75d1b2657c]
+- Updated dependencies [cce8ecee2d]
+- Updated dependencies [18aaf42249]
+- Updated dependencies [f179749375]
+- Updated dependencies [b8494ef33b]
+- Updated dependencies [3fae2d03b3]
+- Updated dependencies [ea7cf06257]
+- Updated dependencies [8a6d45f105]
+- Updated dependencies [143d8dd616]
+- Updated dependencies [bbe4c4ab64]
+- Updated dependencies [ebbeed1ece]
+- Updated dependencies [6354cfa3ae]
+- Updated dependencies [90e2879520]
+- Updated dependencies [e4558a0bc4]
+- Updated dependencies [df41d71ade]
+- Updated dependencies [f727e5c6cc]
+- Updated dependencies [5e3cecd523]
+- Updated dependencies [92de772]
+- Updated dependencies [abf3421a75]
+- Updated dependencies [da2d1fc3c2]
+- Updated dependencies [543be9558e]
+- Updated dependencies [fd1d9fd3d3]
+- Updated dependencies [14b712da84]
+- Updated dependencies [a24f1c9058]
+  - @modern-js/builder-webpack-provider@2.0.0-beta.6
+  - @modern-js/builder-shared@2.0.0-beta.6
+  - @modern-js/prod-server@2.0.0-beta.6
+  - @modern-js/server@2.0.0-beta.6
+  - @modern-js/types@2.0.0-beta.6
+  - @modern-js/utils@2.0.0-beta.6
+  - @modern-js/core@2.0.0-beta.6
+  - @modern-js/builder-plugin-esbuild@2.0.0-beta.6
+  - @modern-js/plugin-data-loader@2.0.0-beta.6
+  - @modern-js/builder-plugin-node-polyfill@2.0.0-beta.6
+  - @modern-js/node-bundle-require@2.0.0-beta.6
+  - @modern-js/plugin-lint@2.0.0-beta.6
+  - @modern-js/plugin@2.0.0-beta.6
+  - @modern-js/builder@2.0.0-beta.6
+  - @modern-js/plugin-i18n@2.0.0-beta.6
+  - @modern-js/new-action@2.0.0-beta.6
+  - @modern-js/upgrade@2.0.0-beta.6
+
 ## 2.0.0-beta.4
 
 ### Major Changes

package/bin/modern.js

@@ -2,12 +2,14 @@
 const {
   INTERNAL_APP_TOOLS_PLUGINS,
   INTERNAL_SERVER_PLUGINS,
+  INTERNAL_APP_TOOLS_RUNTIME_PLUGINS,
 } = require('@modern-js/utils');
 
 require('@modern-js/core/runBin').run({
   internalPlugins: {
     cli: INTERNAL_APP_TOOLS_PLUGINS,
     server: INTERNAL_SERVER_PLUGINS,
+    autoLoad: INTERNAL_APP_TOOLS_RUNTIME_PLUGINS,
   },
   toolsType: 'app-tools',
 });

package/dist/js/modern/analyze/constants.js

@@ -16,6 +16,15 @@ const FILE_SYSTEM_ROUTES_IGNORED_REGEX = /\.(d|test|spec|e2e)\.(js|jsx|ts|tsx)$/
 const HTML_PARTIALS_FOLDER = "html";
 const HTML_PARTIALS_EXTENSIONS = [".htm", ".html", ".ejs"];
 const FILE_SYSTEM_ROUTES_COMPONENTS_DIR = "internal_components";
+const NESTED_ROUTE = {
+  LAYOUT_FILE: "layout",
+  LAYOUT_LOADER_FILE: "layout.loader",
+  PAGE_FILE: "page",
+  PAGE_LOADER_FILE: "page.loader",
+  LOADING_FILE: "loading",
+  ERROR_FILE: "error",
+  LOADER_FILE: "loader"
+};
 export {
   APP_FILE_NAME,
   ENTRY_BOOTSTRAP_FILE_NAME,
@@ -32,6 +41,7 @@ export {
   INDEX_FILE_NAME,
   JS_EXTENSIONS,
   LOADER_EXPORT_NAME,
+  NESTED_ROUTE,
   NESTED_ROUTES_DIR,
   PAGES_DIR_NAME,
   TEMP_LOADERS_DIR

package/dist/js/modern/analyze/generateCode.js

@@ -28,7 +28,7 @@ import {
 import {
   useResolvedConfigContext
 } from "@modern-js/core";
-import { getCommand } from "../utils/commands";
+import { isDevCommand } from "../utils/commands";
 import * as templates from "./templates";
 import { getClientRoutes, getClientRoutesLegacy } from "./getClientRoutes";
 import {
@@ -93,13 +93,12 @@ ${initialize || ""}`
   ).join("\n");
 };
 const buildLoader = (entry, outfile) => __async(void 0, null, function* () {
-  const command = getCommand();
   yield loaderBuilder.build({
     format: "esm",
     platform: "browser",
     target: "esnext",
     loader,
-    watch: command === "dev" && {},
+    watch: isDevCommand() && {},
     bundle: true,
     logLevel: "error",
     entryPoints: [entry],
@@ -124,13 +123,12 @@ const buildLoader = (entry, outfile) => __async(void 0, null, function* () {
   });
 });
 const buildServerLoader = (entry, outfile) => __async(void 0, null, function* () {
-  const command = getCommand();
   yield serverLoaderBuilder.build({
     format: "cjs",
     platform: "node",
     target: "esnext",
     loader,
-    watch: command === "dev" && {},
+    watch: isDevCommand() && {},
     bundle: true,
     logLevel: "error",
     entryPoints: [entry],
@@ -138,7 +136,7 @@ const buildServerLoader = (entry, outfile) => __async(void 0, null, function* ()
   });
 });
 const generateCode = (appContext, config, entrypoints, api) => __async(void 0, null, function* () {
-  var _a, _b;
+  var _a, _b, _c;
   const {
     internalDirectory,
     distDirectory,
@@ -148,9 +146,9 @@ const generateCode = (appContext, config, entrypoints, api) => __async(void 0, n
     packageName
   } = appContext;
   const hookRunners = api.useHookRunners();
-  const islegacy = Boolean((_b = (_a = config == null ? void 0 : config.runtime) == null ? void 0 : _a.router) == null ? void 0 : _b.legacy);
+  const isV5 = typeof ((_a = config.runtime) == null ? void 0 : _a.router) !== "boolean" && ((_c = (_b = config == null ? void 0 : config.runtime) == null ? void 0 : _b.router) == null ? void 0 : _c.mode) === "react-router-5";
   const { mountId } = config.html;
-  const getRoutes = islegacy ? getClientRoutesLegacy : getClientRoutes;
+  const getRoutes = isV5 ? getClientRoutesLegacy : getClientRoutes;
   yield Promise.all(entrypoints.map(generateEntryCode));
   function generateEntryCode(entrypoint) {
     return __async(this, null, function* () {
@@ -169,7 +167,7 @@ const generateCode = (appContext, config, entrypoints, api) => __async(void 0, n
             });
           }
           if (entrypoint.nestedRoutesEntry) {
-            if (!islegacy) {
+            if (!isV5) {
               nestedRoute = yield walk(
                 entrypoint.nestedRoutesEntry,
                 entrypoint.nestedRoutesEntry,

package/dist/js/modern/analyze/getClientRoutes/getRoutes.js

@@ -171,20 +171,23 @@ const getClientRoutes = ({
   internalDirectory,
   internalDirAlias
 }) => {
-  const { entry, entryName } = entrypoint;
-  if (!fs.existsSync(entry)) {
+  const { entryName, pageRoutesEntry } = entrypoint;
+  if (!pageRoutesEntry) {
+    return [];
+  }
+  if (!fs.existsSync(pageRoutesEntry)) {
     throw new Error(
-      `generate file system routes error, ${entry} directory not found.`
+      `generate file system routes error, ${pageRoutesEntry} directory not found.`
     );
   }
-  if (!(fs.existsSync(entry) && fs.statSync(entry).isDirectory())) {
+  if (!(fs.existsSync(pageRoutesEntry) && fs.statSync(pageRoutesEntry).isDirectory())) {
     throw new Error(
-      `generate file system routes error, ${entry} should be directory.`
+      `generate file system routes error, ${pageRoutesEntry} should be directory.`
     );
   }
   let routes = [];
   recursiveReadDir({
-    dir: entry,
+    dir: pageRoutesEntry,
     routes,
     basePath: "/",
     srcDirectory,

package/dist/js/modern/analyze/getFileSystemEntry.js

@@ -63,9 +63,11 @@ const scanDir = (dirs) => dirs.map((dir) => {
     };
     if (isHasPages) {
       entrypoint.entry = path.join(dir, PAGES_DIR_NAME);
+      entrypoint.pageRoutesEntry = entrypoint.entry;
     }
     if (isHasNestedRoutes) {
-      entrypoint.nestedRoutesEntry = path.join(dir, NESTED_ROUTES_DIR);
+      entrypoint.entry = path.join(dir, NESTED_ROUTES_DIR);
+      entrypoint.nestedRoutesEntry = entrypoint.entry;
     }
     return entrypoint;
   }
@@ -79,14 +81,20 @@ const scanDir = (dirs) => dirs.map((dir) => {
 const getFileSystemEntry = (appContext, config) => {
   const { appDirectory } = appContext;
   const {
-    source: { entriesDir }
+    source: { entriesDir, disableEntryDirs }
   } = config;
+  let disabledDirs = [];
+  if (disableEntryDirs && Array.isArray(disableEntryDirs)) {
+    disabledDirs = disableEntryDirs == null ? void 0 : disableEntryDirs.map(
+      (dir) => ensureAbsolutePath(appDirectory, dir)
+    );
+  }
   const src = ensureAbsolutePath(appDirectory, entriesDir || "");
   if (fs.existsSync(src)) {
     if (fs.statSync(src).isDirectory()) {
       return scanDir(
         isBundleEntry(src) ? [src] : fs.readdirSync(src).map((file) => path.join(src, file)).filter(
-          (file) => fs.statSync(file).isDirectory() && isBundleEntry(file)
+          (file) => fs.statSync(file).isDirectory() && isBundleEntry(file) && !disabledDirs.includes(file)
         )
       );
     } else {

package/dist/js/modern/analyze/index.js

@@ -46,13 +46,14 @@ import { generateRoutes } from "../utils/routes";
 import { emitResolvedConfig } from "../utils/config";
 import { getCommand } from "../utils/commands";
 import { initialNormalizedConfig } from "../config";
-import { isRouteComponentFile } from "./utils";
+import { isNestedRouteComponent, isPageComponentFile } from "./utils";
 import { loaderBuilder, serverLoaderBuilder } from "./Builder";
 const debug = createDebugger("plugin-analyze");
 var analyze_default = () => ({
   name: "@modern-js/plugin-analyze",
   setup: (api) => {
     let pagesDir = [];
+    let nestedRouteEntries = [];
     let originEntrypoints = [];
     return {
       prepare() {
@@ -109,7 +110,7 @@ var analyze_default = () => ({
             serverRoutes: routes
           });
           api.setAppContext(appContext);
-          const nestedRouteEntries = entrypoints.map((point) => point.nestedRoutesEntry).filter(Boolean);
+          nestedRouteEntries = entrypoints.map((point) => point.nestedRoutesEntry).filter(Boolean);
           pagesDir = entrypoints.map((point) => point.entry).filter(Boolean).concat(nestedRouteEntries);
           originEntrypoints = cloneDeep(entrypoints);
           yield generateCode(appContext, resolvedConfig, entrypoints, api);
@@ -129,7 +130,7 @@ var analyze_default = () => ({
           });
           api.setAppContext(appContext);
           const command = getCommand();
-          const buildCommands = ["dev", "build", "inspect", "deploy"];
+          const buildCommands = ["dev", "start", "build", "inspect", "deploy"];
           if (buildCommands.includes(command)) {
             let _b;
             const normalizedConfig = api.useResolvedConfigContext();
@@ -185,6 +186,7 @@ var analyze_default = () => ({
                 }
               }
             });
+            builder.addPlugins(resolvedConfig.builderPlugins);
             appContext = __spreadProps(__spreadValues({}, appContext), {
               builder
             });
@@ -215,8 +217,8 @@ var analyze_default = () => ({
           const { filename, eventType } = e;
           const isPageFile = (name) => pagesDir.some((pageDir) => name.includes(pageDir));
           const absoluteFilePath = path.resolve(appDirectory, filename);
-          const isRouteComponent = isPageFile(absoluteFilePath) && isRouteComponentFile(absoluteFilePath);
-          if (isRouteComponent && (eventType === "add" || eventType === "unlink")) {
+          const isRouteComponent = isPageFile(absoluteFilePath) && isPageComponentFile(absoluteFilePath);
+          if (isRouteComponent && (eventType === "add" || eventType === "unlink") || isNestedRouteComponent(nestedRouteEntries, absoluteFilePath) && eventType === "change") {
             const resolvedConfig = api.useResolvedConfigContext();
             const { generateCode } = yield import("./generateCode");
             const entrypoints = cloneDeep(originEntrypoints);

package/dist/js/modern/analyze/nestedRoutes.js

@@ -39,20 +39,9 @@ var __async = (__this, __arguments, generator) => {
 };
 import * as path from "path";
 import { fs, getRouteId } from "@modern-js/utils";
-import { JS_EXTENSIONS } from "./constants";
+import { JS_EXTENSIONS, NESTED_ROUTE } from "./constants";
 import { hasLoader, replaceWithAlias } from "./utils";
-const LAYOUT_FILE = "layout";
-const PAGE_FILE = "page";
-const LOADING_FILE = "loading";
-const ERROR_FILE = "error";
-const LOADER_FILE = "loader";
-const conventionNames = [
-  LAYOUT_FILE,
-  PAGE_FILE,
-  LOADING_FILE,
-  ERROR_FILE,
-  LOADER_FILE
-];
+const conventionNames = Object.values(NESTED_ROUTE);
 const getLoaderPath = (filename) => __async(void 0, null, function* () {
   if (yield hasLoader(filename)) {
     return filename;
@@ -105,6 +94,8 @@ const walk = (dirname, rootDir, alias, entryName) => __async(void 0, null, funct
     children: [],
     isRoot
   };
+  let pageLoaderFile = "";
+  let pageRoute = null;
   const items = yield fs.readdir(dirname);
   for (const item of items) {
     const itemPath = path.join(dirname, item);
@@ -120,12 +111,23 @@ const walk = (dirname, rootDir, alias, entryName) => __async(void 0, null, funct
     if (extname && (!JS_EXTENSIONS.includes(extname) || !conventionNames.includes(itemWithoutExt))) {
       continue;
     }
-    if (itemWithoutExt === LAYOUT_FILE) {
+    if (itemWithoutExt === NESTED_ROUTE.LAYOUT_LOADER_FILE) {
+      if (!route.loader) {
+        route.loader = itemPath;
+      }
+    }
+    if (itemWithoutExt === NESTED_ROUTE.LAYOUT_FILE) {
       route._component = replaceWithAlias(alias.basename, itemPath, alias.name);
-      route.loader = yield getLoaderPath(itemPath);
+      const loaderPath = yield getLoaderPath(itemPath);
+      if (loaderPath) {
+        route.loader = loaderPath;
+      }
     }
-    if (itemWithoutExt === PAGE_FILE) {
-      const childRoute = createIndexRoute(
+    if (itemWithoutExt === NESTED_ROUTE.PAGE_LOADER_FILE) {
+      pageLoaderFile = itemPath;
+    }
+    if (itemWithoutExt === NESTED_ROUTE.PAGE_FILE) {
+      pageRoute = createIndexRoute(
         {
           _component: replaceWithAlias(alias.basename, itemPath, alias.name)
         },
@@ -133,20 +135,25 @@ const walk = (dirname, rootDir, alias, entryName) => __async(void 0, null, funct
         itemPath,
         entryName
       );
-      childRoute.loader = yield getLoaderPath(itemPath);
-      (_b = route.children) == null ? void 0 : _b.push(childRoute);
+      const loaderPath = yield getLoaderPath(itemPath);
+      if (loaderPath) {
+        pageRoute.loader = loaderPath;
+      } else if (pageLoaderFile) {
+        pageRoute.loader = pageLoaderFile;
+      }
+      (_b = route.children) == null ? void 0 : _b.push(pageRoute);
     }
-    if (itemWithoutExt === LOADING_FILE) {
+    if (itemWithoutExt === NESTED_ROUTE.LOADING_FILE) {
       route.loading = replaceWithAlias(alias.basename, itemPath, alias.name);
     }
-    if (itemWithoutExt === ERROR_FILE) {
+    if (itemWithoutExt === NESTED_ROUTE.ERROR_FILE) {
       route.error = replaceWithAlias(alias.basename, itemPath, alias.name);
     }
   }
   const finalRoute = createRoute(
     route,
     rootDir,
-    path.join(dirname, `${LAYOUT_FILE}.ts`),
+    path.join(dirname, `${NESTED_ROUTE.LAYOUT_FILE}.ts`),
     entryName
   );
   if (isPathlessLayout) {

package/dist/js/modern/analyze/templates.js

@@ -315,9 +315,16 @@ const fileSystemRoutes = (_0) => __async(void 0, [_0], function* ({
           TEMP_LOADERS_DIR,
           `${name}.js`
         );
-        const code = `
+        let code = "";
+        if (loader.includes(".loader.")) {
+          code = `
+          export { default as ${name} } from '${slash(loader)}'
+        `;
+        } else {
+          code = `
           export { loader as ${name} } from '${slash(loader)}'
         `;
+        }
         yield fs.ensureFile(filename);
         yield fs.writeFile(filename, code);
       }))