@modern-js/main-doc 0.0.0-next-1682468392848 → 0.0.0-next-1682520086226

package/CHANGELOG.md

@@ -1,19 +1,19 @@
 # @modern-js/main-doc
 
-## 0.0.0-next-1682468392848
+## 0.0.0-next-1682520086226
 
 ### Patch Changes
 
-- 63b35384ea: fix: dev server crashed when prepare api handler failed
+- 63b35384e: fix: dev server crashed when prepare api handler failed
 
   fix: 修复更新 api server 报错导致 dev server 退出的问题
 
-- fe92de6a5f: fix(builder): browserslist config should not affect node bundles
+- fe92de6a5: fix(builder): browserslist config should not affect node bundles
 
   fix(builder): 修复 browserslist 配置会对 node 产物生效的问题
 
-- Updated dependencies [fe92de6a5f]
-  - @modern-js/builder-doc@0.0.0-next-1682468392848
+- Updated dependencies [fe92de6a5]
+  - @modern-js/builder-doc@0.0.0-next-1682520086226
 
 ## 2.15.0
 

package/docs/en/about/contributing-guide.mdx

@@ -0,0 +1,268 @@
+---
+sidebar_position: 3
+---
+
+# Contributing Guide
+
+Thanks for that you are interested in contributing to Modern.js. Before starting your contribution, please take a moment to read the following guidelines.
+
+---
+
+## Setup the Dev Environment
+
+### Fork the Repo
+
+[Fork](https://help.github.com/articles/fork-a-repo/) this repository to your
+own GitHub account and then [clone](https://help.github.com/articles/cloning-a-repository/) it to your local.
+
+### Install Node.js
+
+We recommend using Node.js 16 or 18. You can check your currently used Node.js version with the following command:
+
+```bash
+node -v
+#v16.18.0
+```
+
+If you do not have Node.js installed in your current environment, you can use [nvm](https://github.com/nvm-sh/nvm) or [fnm](https://github.com/Schniz/fnm) to install it.
+
+Here is an example of how to install the Node.js 16 LTS version via nvm:
+
+```bash
+# Install the LTS version of Node.js 16
+nvm install 16 --lts
+
+# Make the newly installed Node.js 16 as the default version
+nvm alias default 16
+
+# Switch to the newly installed Node.js 16
+nvm use 16
+```
+
+### Install pnpm
+
+```sh
+# Enable pnpm with corepack, only available on Node.js >= `v14.19.0`
+corepack enable
+```
+
+### Install Dependencies
+
+```sh
+pnpm install
+```
+
+What this will do:
+
+- Install all dependencies
+- Create symlinks between packages in the monorepo
+- Run the `prepare` script to build all packages (this will take some time, but is necessary to make ensure all packages are built)
+
+> A full rebuild of all packages is generally not required after this. If a new feature you are developing requires an updated version of another package, it is usually sufficient to build the changed dependencies.
+
+### Set Git Email
+
+Please make sure you have your email set up in `<https://github.com/settings/emails>`. This will be needed later when you want to submit a pull request.
+
+Check that your git client is already configured the email:
+
+```sh
+git config --list | grep email
+```
+
+Set the email to global config:
+
+```sh
+git config --global user.email "SOME_EMAIL@example.com"
+```
+
+Set the email for local repo:
+
+```sh
+git config user.email "SOME_EMAIL@example.com"
+```
+
+---
+
+## Making Changes and Building
+
+Once you have set up the local development environment in your forked repo, we can start development.
+
+### Checkout A New Branch
+
+It is recommended to develop on a new branch, as it will make things easier later when you submit a pull request:
+
+```sh
+git checkout -b MY_BRANCH_NAME
+```
+
+### Build the Package
+
+To build the package you want to change, first open the package directory, then run the `build` command:
+
+```sh
+# Replace some-path with the path of the package you want to work on
+cd ./packages/some-path
+pnpm run build
+```
+
+Alternatively, you can build the package from the root directory of the repository using the `--filter` option:
+
+```sh
+pnpm run --filter @modern-js/some-package build
+```
+
+Build all packages:
+
+```sh
+pnpm run prepare
+```
+
+If you need to clean all `node_modules/*` in the project, run the `reset` command:
+
+```sh
+pnpm run reset
+```
+
+---
+
+## Testing
+
+### Add New Tests
+
+If you've fixed a bug or added code that should be tested, then add some tests.
+
+You can add unit test cases in the `<PACKAGE_DIR>/tests` folder. The test syntax is based on [Jest](https://jestjs.io/) and [Vitest](https://vitest.dev/).
+
+### Run Unit Tests
+
+Before submitting a pull request, it's important to make sure that the changes haven't introduced any regressions or bugs. You can run the unit tests for the project by executing the following command:
+
+```sh
+pnpm run test
+```
+
+Alternatively, you can run the unit tests of single package using the `--filter` option:
+
+```sh
+pnpm run --filter @modern-js/some-package test
+```
+
+### Run E2E Tests
+
+In addition to the unit tests, the Modern.js also includes end-to-end (E2E) tests, which checks the functionality of the application as a whole.
+
+You can run the `test:e2e` command to run the E2E tests:
+
+```sh
+pnpm run test:e2e
+```
+
+If you need to run a specified test, you can add keywords to filter:
+
+```sh
+# Only run test cases with the copy-assets keyword
+npx jest copy-assets
+```
+
+---
+
+## Linting
+
+To help maintain consistency and readability of the codebase, we use a ESLint to lint the codes.
+
+You can run the Linter by executing the following command:
+
+```sh
+pnpm run lint
+```
+
+---
+
+## Documentation
+
+Currently Modern.js provides documentation in English and Chinese. If you can use Chinese, please update both documents at the same time. Otherwise, just update the English documentation.
+
+You can find all the documentation in the `packages/document` folder:
+
+```bash
+root
+└─ packages
+   └─ document
+       ├─ builder-doc    # Documentation for Modern.js Builder
+       ├─ doc-tools-doc  # Documentation for Modern.js Doc
+       ├─ main-doc       # Documentation for Modern.js Framework
+       └─ module-doc     # Documentation for Modern.js Module
+```
+
+This website is built with [Modern.js Doc](https://modernjs.dev/doc-tools), the document content can be written using markdown or mdx syntax. You can refer to the [Modern.js Doc Website](https://modernjs.dev/doc-tools) for detailed usage.
+
+The source code of Modern.js Doc can be found in [this folder](https://github.com/web-infra-dev/modern.js/tree/main/packages/solutions/doc-tools).
+
+---
+
+## Submitting Changes
+
+### Add a Changeset
+
+Modern.js is using [Changesets](https://github.com/changesets/changesets) to manage the versioning and changelogs.
+
+If you've changed some packages, you need add a new changeset for the changes. Please run `change` command to select the changed packages and add the changeset info.
+
+```sh
+pnpm run change
+```
+
+### Committing your Changes
+
+Commit your changes to your forked repo, and [create a pull request](https://help.github.com/articles/creating-a-pull-request/).
+
+### Format of PR titles
+
+The format of PR titles follow Conventional Commits.
+
+An example:
+
+```
+feat(plugin-swc): Add `xxx` config
+^    ^    ^
+|    |    |__ Subject
+|    |_______ Scope
+|____________ Type
+```
+
+---
+
+## Publishing
+
+We use **Modern.js Monorepo Solution** to manage version and changelog.
+
+Repository maintainers can publish a new version of all packages to npm.
+
+Here are the steps to publish (we generally use CI for releases and avoid publishing npm packages locally):
+
+1. Pull latest code from the `main` branch.
+2. Install:
+
+```sh
+pnpm i
+```
+
+3. Build packages:
+
+```sh
+pnpm run prepare
+```
+
+4. Bump version:
+
+```sh
+pnpm run bump
+```
+
+5. Commit the version change.
+
+```sh
+git add .
+git commit -m "Release va.b.c"
+```

package/docs/en/about/team.mdx

@@ -8,6 +8,22 @@ The development of Modern.js is driven by ByteDance's Modern.js team and communi
 
 ## Core Team Members
 
+The Modern.js core team members:
+
 import { RandomMemberList } from '@site/src/components/RandomMemberList';
 
 <RandomMemberList />
+
+## All Contributors
+
+Thanks to the following friends for their contributions to Modern.js:
+
+<a
+  href="https://github.com/web-infra-dev/modern.js/graphs/contributors"
+  style={{ display: 'block', marginTop: 24 }}
+>
+  <img
+    src="https://opencollective.com/modernjs/contributors.svg?width=890&button=false"
+    alt="contributors"
+  />
+</a>

package/docs/en/configure/app/source/enable-async-entry.mdx

@@ -33,7 +33,7 @@ Then execute the `dev` or `build` command, and you can see Modern.js automatical
 node_modules
   └─ .modern-js
      └─ main
-        ├─ bootstrap.jsx  #  real entry code
+        ├─ bootstrap.js  #  real entry code
         ├─ index.js      # asynchronous entry file
         └─ index.html
 ```
@@ -41,7 +41,7 @@ node_modules
 The `index.js` reads as follows:
 
 ```js
-import('./bootstrap.jsx');
+import('./bootstrap.js');
 ```
 
 At this point, you can consume any remote modules in the current page.

package/docs/en/guides/advanced-features/rspack-start.mdx

@@ -25,6 +25,7 @@ After the project is created, you can experience the project by running `pnpm ru
 :::tip
 When using Rspack as the bundler, the following Features are temporarily unavailable as some of the capabilities are still under development and we will provide support in the future.
 
+- Micro Frontend
 - Storybook Devtool
 - Server Side Rendering + Conventional Routing
 - Static Site Generation + Conventional Routing

package/docs/zh/about/contributing-guide.mdx

@@ -0,0 +1,267 @@
+---
+sidebar_position: 3
+---
+
+# 贡献指南
+
+感谢你有兴趣为 Modern.js 做贡献！在开始你的贡献之前，请花几分钟时间阅读以下指南。
+
+---
+
+## 设置开发环境
+
+### Fork 仓库
+
+[Fork](https://help.github.com/articles/fork-a-repo/) Modern.js 仓库到你的 GitHub 账户，然后 [clone](https://help.github.com/articles/cloning-a-repository/) 到你的本地。
+
+### 安装 Node.js
+
+我们推荐使用 Node.js 16 或 18。你可以通过以下命令查看当前使用的 Node.js 版本：
+
+```bash
+node -v
+#v16.18.0
+```
+
+如果你当前环境没有安装 Node.js，可以使用 [nvm](https://github.com/nvm-sh/nvm)或者 [fnm](https://github.com/Schniz/fnm) 来安装它。
+
+以下是如何通过 nvm 安装 Node.js 16 LTS 版本的示例：
+
+```bash
+# 安装 Node.js 16 的 LTS 版本
+nvm install 16 --lts
+
+# 将新安装的 Node.js 16 设为默认版本
+nvm alias default 16
+
+# 切换到新安装的 Node.js 16
+nvm use 16
+```
+
+### 安装 pnpm
+
+```bash
+# 使用 corepack 启用 pnpm，仅在 Node.js >= `v14.19.0` 上可用
+corepack enable
+```
+
+### 安装依赖
+
+```sh
+pnpm install
+```
+
+这将完成：
+
+- 安装所有依赖项
+- 在 monorepo 中的 packages 之间创建 symlinks
+- 运行 `prepare` 脚本来构建所有包（这将需要一些时间，但可以保证所有包都被正确构建）
+
+> 在此之后，你通常不需要一次性构建所有 packages。如果你正在开发的新功能依赖另一个 package 的最新代码，通常只构建指定的 package 就足够了。
+
+### 设置 Git 邮箱
+
+请确保在 `<https://github.com/settings/emails>` 中设置了电子邮件，当你提交 Pull Request 时将需要它。
+
+检查你的 git 客户端是否已配置邮箱：
+
+```sh
+git config --list | grep email
+```
+
+全局设置邮箱：
+
+```sh
+git config --global user.email "SOME_EMAIL@example.com"
+```
+
+针对本地仓库设置邮箱：
+
+```sh
+git config user.email "SOME_EMAIL@example.com"
+```
+
+---
+
+## 代码变更和构建
+
+当你在 fork 的仓库中设置完本地开发环境后，我们就可以开始开发了。
+
+### 创建一个新分支
+
+建议在一个新的分支上开发，这样便于后续提交 pull request：
+
+```sh
+git checkout -b MY_BRANCH_NAME
+```
+
+### 构建 Package
+
+要构建你要更改的 package，首先打开 package 目录，然后执行 `build` 命令：
+
+```sh
+# 将 some-path 替换为你要构建的 package 的路径
+cd ./packages/some-package
+pnpm run build
+```
+
+此外，你可以使用 `--filter` 选项从仓库根目录来构建指定的 package：
+
+```sh
+pnpm run --filter @modern-js/some-package build
+```
+
+构建所有包：
+
+```sh
+pnpm run prepare
+```
+
+如果你需要清理项目中的所有 `node_modules/*`，执行 `reset` 命令：
+
+```sh
+pnpm 运行重置
+```
+
+---
+
+## 测试
+
+### 添加新测试
+
+如果你进行了 bugfix，或者添加了需要测试的代码，请添加一些测试代码。
+
+你可以在 `<PACKAGE_DIR>/tests` 文件夹中添加单元测试用例。测试语法基于 [Jest](https://jestjs.io/) 和 [Vitest](https://vitest.dev/)。
+
+### 运行单元测试
+
+在提交 pull request 之前，为了确保本次变更没有引入缺陷，你可以通过执行以下命令运行单元测试：
+
+```sh
+pnpm run test
+```
+
+你也可以使用 `--filter` 选项运行单个包的单元测试：
+
+```sh
+pnpm run --filter @modern-js/some-package test
+```
+
+### 运行 E2E 测试
+
+除了单元测试之外，Modern.js 仓库还包括端到端 (E2E) 测试，用于检查整个应用程序的功能。
+
+你可以执行 `test:e2e` 命令来运行 E2E 测试：
+
+```sh
+pnpm run test:e2e
+```
+
+如果需要运行指定的测试，可以添加关键字进行过滤：
+
+```sh
+# 只运行带有 copy-assets 关键词的测试用例
+npx jest copy-assets
+```
+
+---
+
+## Linting
+
+为了帮助保持代码风格的一致性和可读性，我们使用 ESLint 对代码进行校验。
+
+你可以执行以下命令来运行 Linter：
+
+```sh
+pnpm run lint
+```
+
+---
+
+## 文档
+
+目前 Modern.js 提供英文和中文文档。如果你熟悉中文，请同时更新中英文文档。否则，只需更新英文文档即可。
+
+你可以在 `packages/document` 文件夹中找到所有文档：
+
+```sh
+root
+└─ packages
+   └─ document
+       ├─ builder-doc    # Modern.js Builder 文档
+       ├─ doc-tools-doc  # Modern.js Doc 文档
+       ├─ main-doc       # Modern.js Framework 文档
+       └─ module-doc     # Modern.js Module 文档
+```
+
+文档站使用 [Modern.js Doc](https://modernjs.dev/doc-tools) 构建，文档内容可以使用 markdown 或 mdx 语法编写。详细使用方法可以参考 [Modern.js Doc 文档](https://modernjs.dev/doc-tools)。
+
+Modern.js Doc 的源代码可以在 [这个文件夹](https://github.com/web-infra-dev/modern.js/tree/main/packages/solutions/doc-tools) 中找到。
+
+---
+
+## 提交变更
+
+### 添加 Changeset
+
+Modern.js 使用 [Changesets](https://github.com/changesets/changesets) 来管理版本和 Changelog。
+
+如果你修改了一些包，则需要为本次变更添加一个新的变更集。请运行 `change` 命令来选择更改的包并添加 changeset 信息。
+
+```sh
+pnpm run change
+```
+
+### 提交你的变更
+
+提交变更到 fork 后的仓库，并 [创建 pull request](https://help.github.com/articles/creating-a-pull-request/)。
+
+### PR 标题格式
+
+PR 标题的格式遵循 Conventional Commits。
+
+一个例子：
+
+```
+feat(plugin-swc): 添加 `xxx` 配置项
+^ ^ ^
+| | |__ 主题
+| |_______ 范围
+|____________ 类型
+```
+
+---
+
+## 发布
+
+Modern.js 使用 [Changesets](https://github.com/changesets/changesets) 来管理版本和 changelog。
+
+仓库的维护者可以将所有包的新版本发布到 npm。
+
+以下是发布的步骤（我们通常使用 CI 进行发布，并避免在本地发布 npm 包）：
+
+1. 拉取 `main` 分支的最新代码。
+2. 安装依赖：
+
+```sh
+pnpm i
+```
+
+3. 构建 packages：
+
+```sh
+pnpm prepare
+```
+
+4. 升级版本：
+
+```sh
+pnpm run bump
+```
+
+5. 提交版本变更。
+
+```sh
+git add .
+git commit -m "Release va.b.c"
+```

package/docs/zh/about/team.mdx

@@ -8,6 +8,22 @@ Modern.js 的开发由字节跳动的 Modern.js 团队和社区贡献者驱动
 
 ## 核心团队成员
 
+以下是 Modern.js 团队的核心成员：
+
 import { RandomMemberList } from '@site/src/components/RandomMemberList';
 
 <RandomMemberList />
+
+## 所有贡献者
+
+感谢以下伙伴们为 Modern.js 做出的贡献：
+
+<a
+  href="https://github.com/web-infra-dev/modern.js/graphs/contributors"
+  style={{ display: 'block', marginTop: 24 }}
+>
+  <img
+    src="https://opencollective.com/modernjs/contributors.svg?width=890&button=false"
+    alt="contributors"
+  />
+</a>

package/docs/zh/configure/app/source/enable-async-entry.mdx

@@ -36,7 +36,7 @@ export default defineConfig({
 node_modules
   └─ .modern-js
      └─ main
-        ├─ bootstrap.jsx  # 真正的入口代码
+        ├─ bootstrap.js  # 真正的入口代码
         ├─ index.js      # 异步入口文件（asynchronous boundary）
         └─ index.html
 ```
@@ -44,7 +44,7 @@ node_modules
 其中 `index.js` 的内容如下：
 
 ```js
-import('./bootstrap.jsx');
+import('./bootstrap.js');
 ```
 
 此时，就可以在当前页面中消费任意的远程模块了。

package/docs/zh/guides/advanced-features/rspack-start.mdx

@@ -26,6 +26,7 @@ import InitRspackApp from '@site-docs/components/init-rspack-app';
 :::tip
 在使用 Rspack 作为打包工具时，由于部分能力尚在开发中，以下 features 暂时无法使用，我们将在未来提供支持：
 
+- 微前端（Micro Frontend）
 - Storybook 调试
 - 同时使用服务端渲染（SSR）和约定式路由的场景
 - 同时使用静态站点生成（SSG）和约定式路由的场景

package/package.json

@@ -11,13 +11,13 @@
     "modern",
     "modern.js"
   ],
-  "version": "0.0.0-next-1682468392848",
+  "version": "0.0.0-next-1682520086226",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/",
     "access": "public"
   },
   "peerDependencies": {
-    "@modern-js/builder-doc": "0.0.0-next-1682468392848"
+    "@modern-js/builder-doc": "0.0.0-next-1682520086226"
   },
   "devDependencies": {
     "classnames": "^2",
@@ -29,9 +29,9 @@
     "fs-extra": "^10",
     "@types/node": "^16",
     "@types/fs-extra": "^9",
-    "@modern-js/builder-doc": "0.0.0-next-1682468392848",
-    "@modern-js/doc-tools": "0.0.0-next-1682468392848",
-    "@modern-js/doc-plugin-auto-sidebar": "0.0.0-next-1682468392848"
+    "@modern-js/builder-doc": "0.0.0-next-1682520086226",
+    "@modern-js/doc-tools": "0.0.0-next-1682520086226",
+    "@modern-js/doc-plugin-auto-sidebar": "0.0.0-next-1682520086226"
   },
   "scripts": {
     "dev": "modern dev",