@modern-js/main-doc 0.0.0-next-20221226123440 → 0.0.0-next-20221226142557

package/.turbo/turbo-build.log

@@ -1,4 +1,4 @@
 
-> @modern-js/main-doc@2.0.0-beta.6 build /github/workspace/packages/toolkit/main-doc
+> @modern-js/main-doc@2.0.0-beta.6 build /tmp/repo/modern.js/packages/toolkit/main-doc
 > npx ts-node ./scripts/sync.ts
 

package/CHANGELOG.md

@@ -1,35 +1,33 @@
 # @modern-js/main-doc
 
-## 0.0.0-next-20221226123440
+## 0.0.0-next-20221226142557
 
 ### Patch Changes
 
-- 7879e8f711: refactor: remove enableModernMode config
+- 7879e8f71: refactor: remove enableModernMode config
 
   refactor: 不再支持 enableModernMode 配置项
 
-- 8f8fc35401: chore: modify plugin-garfish doc
-  chore: 修改 plugin-garfish 文档
-- 5927355ee1: feat: develop documentation directly with main-doc
+- 5927355ee: feat: develop documentation directly with main-doc
   feat: 直接使用 main-doc 包开发文档
-- ebf899fb5a: feat(app-tools): support configure builder plugins
+- ebf899fb5: feat(app-tools): support configure builder plugins
 
   feat(app-tools): 支持配置 builder 插件
 
-- 1ef69374be: feat: support update main-doc when package build or website build
+- 1ef69374b: feat: support update main-doc when package build or website build
   feat: 支持在包发布和官网发布时，更新 main-doc 包
-- Updated dependencies [2bc090c089]
-- Updated dependencies [f96a725211]
-- Updated dependencies [57077b2c64]
-- Updated dependencies [2ff6167be0]
-- Updated dependencies [309f08bdf4]
-- Updated dependencies [5402fdb0ca]
-- Updated dependencies [10d08a480d]
-- Updated dependencies [5d67c26cdb]
-- Updated dependencies [af4422d67f]
-- Updated dependencies [dda38c9c3e]
-- Updated dependencies [812913ccdd]
-- Updated dependencies [3fae2d03b3]
-- Updated dependencies [df41d71ade]
-- Updated dependencies [14b712da84]
-  - @modern-js/builder-doc@0.0.0-next-20221226123440
+- Updated dependencies [2bc090c08]
+- Updated dependencies [f96a72521]
+- Updated dependencies [57077b2c6]
+- Updated dependencies [2ff6167be]
+- Updated dependencies [309f08bdf]
+- Updated dependencies [5402fdb0c]
+- Updated dependencies [10d08a480]
+- Updated dependencies [5d67c26cd]
+- Updated dependencies [af4422d67]
+- Updated dependencies [dda38c9c3]
+- Updated dependencies [812913ccd]
+- Updated dependencies [3fae2d03b]
+- Updated dependencies [df41d71ad]
+- Updated dependencies [14b712da8]
+  - @modern-js/builder-doc@0.0.0-next-20221226142557

package/en/docusaurus-plugin-content-docs/current/configure/app/dev/with-master-app.md

@@ -0,0 +1,31 @@
+---
+sidebar_label: withMasterApp
+---
+
+# dev.withMasterApp
+
+* Type: `Object`
+* Default: `null`
+
+When the project is a micro-front-end sub-application, you can use the `withMasterApp` configuration to enable the sub-application debugging mode.
+
+:::caution Caution
+When using child app debugging mode, you should first ensure that the main app has online debugging mode turned on.
+:::
+
+```js title=modern.config.js
+export default defineConfig({
+  dev: {
+    withMasterApp: {
+      //the path of the main application
+      moduleApp: 'https://www.masterApp.com',
+      //name of the subapplication
+      moduleName: 'Contact'
+    }
+  }
+})
+```
+
+- moduleApp: `string` Online address of the main application.
+- moduleName: `Contact` The name of the child app (needs to match the module name registered in the main app)。
+

package/package.json

@@ -11,20 +11,20 @@
     "modern",
     "modern.js"
   ],
-  "version": "0.0.0-next-20221226123440",
+  "version": "0.0.0-next-20221226142557",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/",
     "access": "public"
   },
   "peerDependencies": {
-    "@modern-js/builder-doc": "0.0.0-next-20221226123440"
+    "@modern-js/builder-doc": "0.0.0-next-20221226142557"
   },
   "devDependencies": {
     "ts-node": "^10",
     "fs-extra": "^10",
     "@types/node": "^16",
     "@types/fs-extra": "^9",
-    "@modern-js/builder-doc": "0.0.0-next-20221226123440"
+    "@modern-js/builder-doc": "0.0.0-next-20221226142557"
   },
   "scripts": {
     "build": "npx ts-node ./scripts/sync.ts"

package/zh/configure/app/runtime/master-app.md

@@ -13,10 +13,24 @@ sidebar_label: masterApp
 ## 示例
 
 import EnableMicroFrontend from '@site-docs/components/enable-micro-frontend.md';
-import MasterAppConfig from '@site-docs/components/micro-master-app-config.md';
 
 <EnableMicroFrontend />
-<MasterAppConfig />
+
+## `manifest`
+
+```ts
+interface Manifest {
+  getAppList?: ()=> Array<AppInfo>
+}
+```
+
+#### `getAppList?`
+
+通过 `getAppList` 配置，可以自定义如何获取远程列表数据
+
+```ts
+type GetAppList = ()=> Promise<Array<AppInfo>>;
+```
 
 
 ### apps

package/zh/guides/topic-detail/framework-plugin/implement.md

@@ -30,11 +30,23 @@ const MyPlugin = {
 };
 ```
 
-另外，在插件中，允许配置与其他插件的执行顺序，详情可以参考[插件关系](/docs/guides/topic-detail/framework-plugin/relationship)。
+另外，在插件中，允许配置与其他插件的执行顺序。详情可以参考[插件关系](/docs/guides/topic-detail/framework-plugin/relationship)。
 
 ### 插件类型
 
-使用 TypeScript 时，可以引入内置的 `CliPlugin` 类型，为插件提供正确的类型推导：
+Modern-js 支持多种工程开发，如应用工程(app-tools), 模块工程(module-tools)等。
+
+为了兼顾不同工程开发的差异和通性，Modern-js 将插件如下图进行组织:
+
+![plugin-relationship](https://lf3-static.bytednsdoc.com/obj/eden-cn/eeeh7uhbepxlpe/modern-website/plugin-relationship.jpg)
+
+从图可以看出，Modern-js 将插件大致分为两类:
+
+1. 通用插件: 插件只会包含一些基础的 Hooks
+
+2. 工程插件: 不同的工程开发会在通用插件的基础上扩展出自己的 Hooks, Config 等类型。
+
+使用 TypeScript 时，可以引入内置的 `CliPlugin` 等类型，为插件提供正确的类型推导。
 
 ```ts
 import type { CliPlugin } from '@modern-js/core';
@@ -54,19 +66,55 @@ const MyPlugin: CliPlugin = {
 };
 ```
 
-Modern.js 导出的 `Plugin` 类型支持泛型扩展。
+上述代码为通用插件，只包含一些基础的 Hooks。 Modern.js 支持通过泛型对插件的定义进行扩展：
+
+```ts
+import type { CliPlugin, AppTools } from '@modern-js/app-tools';
 
-在 Modern.js 中，任意插件可以注册自己的 Hook，如果想拥有其他插件注册的 Hook 的类型，可以添加泛型：
+const MyPlugin: CliPlugin<AppTools> = {
+  name: 'my-plugin',
+
+  setup() {
+    const foo = '1';
+
+    return {
+      afterBuild: () => {
+        // 在构建完成后执行逻辑
+      },
+    };
+  },
+};
+```
+
+如果仔细观察 `AppTools` 这个类型，可以发现 `AppTools` 由 3 种类型构成.
+
+```ts
+type AppTools = {
+  hooks: AppToolsHooks;
+  userConfig: AppToolsUserConfig;
+  normalizedConfig: AppToolsNormalizedConfig;
+};
+```
+
+当编写插件时，插件通过泛型扩展在不同的基础上扩展自己的 Hooks 等类型:
 
 ```ts
+// 通用插件上扩展
 import type { CliPlugin } from '@modern-js/core';
 import type { MyPluginHook } from 'xxx';
 
-const MyPlugin: CliPlugin<MyPluginHook> = {};
+const MyPlugin: CliPlugin<{ hooks: MyPluginHook }> = {};
 ```
 
-详细说明，请参考 [扩展 Hook](/docs/guides/topic-detail/framework-plugin/extend)。
+```ts
+// 在 @modern-js/app-tools 基础上扩展
+import type { CliPlugin, AppTools } from '@modern-js/app-tools';
+import type { MyPluginHook } from 'xxx';
+
+const MyPlugin: CliPlugin<AppTools & { hooks: MyPluginHook }> = {};
+```
 
+详细说明，请参考 [扩展 Hook](/docs/guides/topic-detail/framework-plugin/extend)。
 
 ### 插件配置项
 

package/zh/components/micro-master-app-config.md

@@ -1,15 +0,0 @@
-## `manifest`
-
-```ts
-interface Manifest {
-  getAppList?: ()=> Array<AppInfo>
-}
-```
-
-#### `getAppList?`
-
-通过 `getAppList` 配置，可以自定义如何获取远程列表数据
-
-```ts
-type GetAppList = ()=> Promise<Array<AppInfo>>;
-```