@modern-js/main-doc 2.0.3-alpha.0 → 2.2.0

package/en/docusaurus-plugin-content-docs/current/tutorials/foundations/introduction.md

@@ -1,45 +0,0 @@
----
-title: Introduce
-sidebar_position: 1
----
-
-Welcome to Modern.js tutorials!
-
-After reading this section, you will have an initial understanding of Modern.js and use Modern.js to create your first application.
-
-:::note Follow
-Join our Lark group to ask questions and learn about the latest news.
-:::
-
-## What is Modern.js
-
-**Modern.js** is a progressive modern web development framework based on React.
-
-The framework has a variety of built-in out-of-the-box tools, excellent build performance, zero-configuration rendering paradigm switching, and integrated API calls. Starting from three solutions (Application solutions, Module solutions, Monorepo solutions), it supports front-end research and development of a complete period.
-
-Modern.js is ByteDance's underlying front-end framework, which has directly or indirectly served thousands of applications, including middle and back-end, PC Web, H5 and other application scenarios. The framework covers a full life cycle, has a complete plugin system, and provides a high degree of customization capabilities. Support custom solutions exclusive to business lines through generator plugin, customize various functional extensions and business requirements, and help developers build applications faster.
-
-## Why Modern.js
-
-Modern.js can provide developers with the ultimate **Development Experience**，make the app better **User Experience**。
-
-In the process of developing React applications, developers often need to design implementations for certain functions, or use other libraries and frameworks to solve these problems。
-
-Modern.js support all the configuration and tools required by React applications, and have built-in **additional functions and optimizations**. Developers can use React to build the UI of the application, and then gradually adopt Modern.js functions to solve common application requirements, such as routing, data fetch, state management, etc.
-
-It mainly contains the following features:
-
-- 🪜 **Progressive**：Create projects with the most streamlined templates, gradually turn on plugin capabilities through generators, and customize solutions.
-- 🏠 **Integration**：The development is unique to the production environment Web Server, CSR and SSR are isomorphic development, and the function as the API service call.
-- 📦 **Out Of The Box**：Default TS support, built-in build core, ESLint, debugging tools, full functionality can be tested.
-- 🌏 **Ecology**：Self-developed state management, micro frontend, module packaging, Monorepo solution and other peripheral requirements.
-- 🕸 **Routing Modes**：Contains controlled routing, routing based on file conventions (nested routing), configurable routing, etc。
-- 🚀 **Independently Build Core**：Support a variety of packaging tools, deep optimization bundle.
-
-## Next
-
-<!-- If you are a front-end beginner, you may find these concepts a bit complicated. We provide some [JavaScript and React](/docs/tutorials/foundations/basic) learning materials, you can do some understanding of them first。
-
-If you are an experienced developer and want to know how to use Modern.js, you can try [Create your first app](/docs/tutorials/first-app/c01-start), or read [Guide](/docs/guides/get-started/quick-start). -->
-
-If you want to know how to use Modern.js, you can try [Create your first app](/docs/tutorials/first-app/c01-start), or read [Guide](/docs/guides/get-started/quick-start).

package/en/docusaurus-plugin-content-docs/current.json

@@ -1,254 +0,0 @@
-{
-  "version.label": {
-    "message": "Next",
-    "description": "The label for version current"
-  },
-  "sidebar.tutorialsSidebar.category.基础": {
-    "message": "Basic",
-    "description": "The label for category 基础 in sidebar tutorialsSidebar"
-  },
-  "sidebar.tutorialsSidebar.category.联系人列表应用": {
-    "message": "First App",
-    "description": "The label for category 联系人列表应用 in sidebar tutorialsSidebar"
-  },
-  "sidebar.guidesSidebar.category.开始": {
-    "message": "Start",
-    "description": "The label for category 开始 in sidebar guidesSidebar"
-  },
-  "sidebar.guidesSidebar.category.核心概念": {
-    "message": "Core Concept",
-    "description": "The label for category 核心概念 in sidebar guidesSidebar"
-  },
-  "sidebar.guidesSidebar.category.基础功能": {
-    "message": "Basic Features",
-    "description": "The label for category 基础功能 in sidebar guidesSidebar"
-  },
-  "sidebar.guidesSidebar.category.CSS 开发方案": {
-    "message": "CSS Development",
-    "description": "The label for category CSS 开发方案 in sidebar guidesSidebar"
-  },
-  "sidebar.guidesSidebar.category.进阶功能": {
-    "message": "Advanced Features",
-    "description": "The label for category 进阶功能 in sidebar guidesSidebar"
-  },
-  "sidebar.guidesSidebar.category.BFF": {
-    "message": "BFF",
-    "description": "The label for category BFF in sidebar guidesSidebar"
-  },
-  "sidebar.guidesSidebar.category.专题详解": {
-    "message": "Topic Detail",
-    "description": "The label for category 专题详解 in sidebar guidesSidebar"
-  },
-  "sidebar.guidesSidebar.category.Reduck 状态管理": {
-    "message": "Reduck State Manager",
-    "description": "The label for category Reduck 状态管理 in sidebar guidesSidebar"
-  },
-  "sidebar.guidesSidebar.category.微前端": {
-    "message": "Micro-frontend",
-    "description": "The label for category 微前端 in sidebar guidesSidebar"
-  },
-  "sidebar.guidesSidebar.category.Monorepo": {
-    "message": "Monorepo",
-    "description": "The label for category Monorepo in sidebar guidesSidebar"
-  },
-  "sidebar.guidesSidebar.category.包版本管理": {
-    "message": "Package Version Manager",
-    "description": "The label for category 包版本管理 in sidebar guidesSidebar"
-  },
-  "sidebar.guidesSidebar.category.自定义插件": {
-    "message": "Customized plugins",
-    "description": "The label for category 自定义插件 in sidebar guidesSidebar"
-  },
-  "sidebar.guidesSidebar.category.项目生成器": {
-    "message": "Project Generator",
-    "description": "The label for category 项目生成器 in sidebar guidesSidebar"
-  },
-  "sidebar.guidesSidebar.category.工程方案配置": {
-    "message": "Engineering configuration",
-    "description": "The label for category 工程方案配置 in sidebar guidesSidebar"
-  },
-  "sidebar.guidesSidebar.category.开发生成器插件": {
-    "message": "Development Generator Plugin",
-    "description": "The label for category 开发生成器插件 in sidebar guidesSidebar"
-  },
-  "sidebar.guidesSidebar.category.开发微生成器": {
-    "message": "Develop microgenerator",
-    "description": "The label for category 开发微生成器 in sidebar guidesSidebar"
-  },
-  "sidebar.guidesSidebar.category.自定义输入 API": {
-    "message": "Customized Input API",
-    "description": "The label for category 自定义输入 API in sidebar guidesSidebar"
-  },
-  "sidebar.guidesSidebar.category.获取信息 API": {
-    "message": "Get Information API",
-    "description": "The label for category 获取信息 API in sidebar guidesSidebar"
-  },
-  "sidebar.guidesSidebar.category.Hook 函数 API": {
-    "message": "Hook Function API",
-    "description": "The label for category Hook 函数 in sidebar guidesSidebar"
-  },
-  "sidebar.guidesSidebar.category.文件操作 API": {
-    "message": "File API",
-    "description": "The label for category 文件操作 API in sidebar guidesSidebar"
-  },
-  "sidebar.guidesSidebar.category.启用功能 API": {
-    "message": "Enable function API",
-    "description": "The label for category 启用功能 API in sidebar guidesSidebar"
-  },
-  "sidebar.guidesSidebar.category.常见问题": {
-    "message": "常见问题",
-    "description": "The label for category 常见问题 in sidebar guidesSidebar"
-  },
-  "sidebar.apisAppSidebar.category.文件约定": {
-    "message": "Convention",
-    "description": "The label for category convention in sidebar apisAppSidebar"
-  },
-  "sidebar.apisAppSidebar.category.src/": {
-    "message": "src/",
-    "description": "The label for category src/ in sidebar apisAppSidebar"
-  },
-  "sidebar.apisAppSidebar.category.api/": {
-    "message": "api/",
-    "description": "The label for category api/ in sidebar apisAppSidebar"
-  },
-  "sidebar.apisAppSidebar.category.函数写法": {
-    "message": "Function",
-    "description": "The label for category Function in sidebar apisAppSidebar"
-  },
-  "sidebar.apisAppSidebar.category.框架写法": {
-    "message": "Framework",
-    "description": "The label for category Framework in sidebar apisAppSidebar"
-  },
-  "sidebar.apisAppSidebar.category.server/": {
-    "message": "server/",
-    "description": "The label for category server/ in sidebar apisAppSidebar"
-  },
-  "sidebar.apisAppSidebar.category.config/": {
-    "message": "config/",
-    "description": "The label for category config/ in sidebar apisAppSidebar"
-  },
-  "sidebar.apisAppSidebar.category.命令": {
-    "message": "Commands",
-    "description": "The label for category command in sidebar apisAppSidebar"
-  },
-  "sidebar.apisAppSidebar.category.运行时": {
-    "message": "Runtime",
-    "description": "The label for category runtime in sidebar apisAppSidebar"
-  },
-  "sidebar.apisAppSidebar.category.核心": {
-    "message": "Core",
-    "description": "The label for category Core API in sidebar apisAppSidebar"
-  },
-  "sidebar.apisAppSidebar.category.App": {
-    "message": "App",
-    "description": "The label for category App API in sidebar apisAppSidebar"
-  },
-  "sidebar.apisAppSidebar.category.BFF Server": {
-    "message": "BFF Server",
-    "description": "The label for category BFF Server API in sidebar apisAppSidebar"
-  },
-  "sidebar.apisAppSidebar.category.Model": {
-    "message": "Model",
-    "description": "The label for category Model API in sidebar apisAppSidebar"
-  },
-  "sidebar.apisAppSidebar.category.Container": {
-    "message": "Container",
-    "description": "The label for category Container API in sidebar apisAppSidebar"
-  },
-  "sidebar.apisAppSidebar.category.Testing": {
-    "message": "Testing",
-    "description": "The label for category Testing API in sidebar apisAppSidebar"
-  },
-  "sidebar.apisAppSidebar.category.Web Server": {
-    "message": "Web Server",
-    "description": "The label for category Web Server API in sidebar apisAppSidebar"
-  },
-  "sidebar.apisAppSidebar.category.Utility": {
-    "message": "Utility",
-    "description": "The label for category Utility API in sidebar apisAppSidebar"
-  },
-  "sidebar.apisAppSidebar.category.loadable": {
-    "message": "loadable",
-    "description": "The label for category loadable in sidebar apisAppSidebar"
-  },
-  "sidebar.apisAppSidebar.category.插件": {
-    "message": "插件",
-    "description": "The label for category 插件 API in sidebar apisAppSidebar"
-  },
-  "sidebar.apisMonorepoSidebar.category.文件约定": {
-    "message": "Convention",
-    "description": "The label for category convention in sidebar apisMonorepoSidebar"
-  },
-  "sidebar.apisMonorepoSidebar.category.命令": {
-    "message": "命令",
-    "description": "The label for category 命令 in sidebar apisMonorepoSidebar"
-  },
-  "sidebar.apisGeneratorSidebar.category.生成器插件 API": {
-    "message": "生成器插件 API",
-    "description": "The label for category 生成器插件 API in sidebar apisGeneratorSidebar"
-  },
-  "sidebar.apisGeneratorSidebar.category.自定义输入 API": {
-    "message": "自定义输入 API",
-    "description": "The label for category 自定义输入 API in sidebar apisGeneratorSidebar"
-  },
-  "sidebar.apisGeneratorSidebar.category.获取信息 API": {
-    "message": "获取信息 API",
-    "description": "The label for category 获取信息 API in sidebar apisGeneratorSidebar"
-  },
-  "sidebar.apisGeneratorSidebar.category.Hook 函数 API": {
-    "message": "Hook 函数 API",
-    "description": "The label for category Hook 函数 API in sidebar apisGeneratorSidebar"
-  },
-  "sidebar.apisGeneratorSidebar.category.文件操作 API": {
-    "message": "文件操作 API",
-    "description": "The label for category 文件操作 API in sidebar apisGeneratorSidebar"
-  },
-  "sidebar.apisGeneratorSidebar.category.启用功能 API": {
-    "message": "启用功能 API",
-    "description": "The label for category 启用功能 API in sidebar apisGeneratorSidebar"
-  },
-  "sidebar.apisGeneratorSidebar.category.NPM API": {
-    "message": "NPM API",
-    "description": "The label for category NPM API in sidebar apisGeneratorSidebar"
-  },
-  "sidebar.apisGeneratorSidebar.category.GIT API": {
-    "message": "GIT API",
-    "description": "The label for category GIT API in sidebar apisGeneratorSidebar"
-  },
-  "sidebar.configsAppSidebar.category.source (源文件)": {
-    "message": "source",
-    "description": "The label for category source in sidebar configsAppSidebar"
-  },
-  "sidebar.configsAppSidebar.category.output (构建产物)": {
-    "message": "output",
-    "description": "The label for category output in sidebar configsAppSidebar"
-  },
-  "sidebar.configsAppSidebar.category.runtime (运行时)": {
-    "message": "runtime",
-    "description": "The label for category runtime in sidebar configsAppSidebar"
-  },
-  "sidebar.configsAppSidebar.category.server (服务器)": {
-    "message": "server",
-    "description": "The label for category server in sidebar configsAppSidebar"
-  },
-  "sidebar.configsAppSidebar.category.deploy (部署)": {
-    "message": "deploy",
-    "description": "The label for category deploy in sidebar configsAppSidebar"
-  },
-  "sidebar.configsAppSidebar.category.bff (BFF API)": {
-    "message": "bff",
-    "description": "The label for category bff in sidebar configsAppSidebar"
-  },
-  "sidebar.configsAppSidebar.category.dev (开发调试)": {
-    "message": "dev ",
-    "description": "The label for category dev in sidebar configsAppSidebar"
-  },
-  "sidebar.configsAppSidebar.category.testing (测试)": {
-    "message": "testing",
-    "description": "The label for category testing in sidebar configsAppSidebar"
-  },
-  "sidebar.configsAppSidebar.category.tools (底层配置)": {
-    "message": "tools",
-    "description": "The label for category tools  in sidebar configsAppSidebar"
-  }
-}

package/zh/apis/app/commands/build.md

@@ -1,44 +0,0 @@
----
-sidebar_position: 5
----
-
-```bash
-Usage: modern build [options]
-
-build application
-
-Options:
-  -c --config <config>  指定配置文件路径，可以为相对路径或绝对路径
-  -h, --help  显示命令帮助
-  --analyze   分析构建产物体积，查看各个模块打包后的大小
-```
-
-`modern build` 命令默认会在 `dist/` 目录下构建出可用于生产环境的产物。
-
-可以通过修改配置 [`output.distPath`](/docs/configure/app/output/dist-path) 指定产物的输出目录。
-
-## 分析构建产物体积
-
-执行 `npx modern build --analyze` 命令，可以在打包生产环境代码的同时，产出一个分析构建产物体积的 HTML 文件：
-
-```
-Bundle Analyzer saved report to /example/dist/report.html
-File sizes after production build:
-
-  122.35 KB  dist/static/js/885.1d4fbe5a.js
-  2.3 KB     dist/static/js/main.4b8e8d64.js
-  761 B      dist/static/js/runtime-main.edb7cf35.js
-  645 B      dist/static/css/main.0dd3ecc1.css
-```
-
-手动在浏览器中打开上述 HTML 文件，可以看到打包产物的瓦片图，并进行包体积分析和优化：
-
-<img src="https://lf3-static.bytednsdoc.com/obj/eden-cn/aphqeh7uhohpquloj/modern-js/mwa-build-analyze-8784f762c1ab0cb20935829d5f912c4c.png" />
-
-> 该功能基于 [webpack-bundle-analyzer](https://github.com/webpack-contrib/webpack-bundle-analyzer) 实现。
-
-## 命令行参数
-
-import CommandTip from '@site-docs/components/command-tip.md'
-
-<CommandTip />

package/zh/apis/app/commands/dev.md

@@ -1,36 +0,0 @@
----
-sidebar_position: 1
----
-
-# dev / start
-
-```bash
-Usage: modern dev / modern start [options]
-
-本地开发命令
-
-Options:
-  -e --entry <entry>    指定入口，编译特定的页面
-  -c --config <config>  指定配置文件路径，可以为相对路径或绝对路径
-  -h, --help            显示命令帮助
-  --analyze             分析构建产物体积，查看各个模块打包后的大小
-  --api-only            仅启动 API 接口服务
-```
-
-`modern dev` 命令用于启动一个本地开发服务器，对源代码进行开发环境编译，同时监听源文件变化，默认支持模块热更新和 React Fast Refresh。
-
-`modern start` 是 `modern dev` 命令的别名，两者的功能和用法完全一致。
-
-```bash
-$ modern dev
-
-info    Starting dev server...
-info    App running at:
-
-  > Local:    http://localhost:8080/
-  > Network:  http://192.168.0.1:8080/
-```
-
-import CommandTip from '@site-docs/components/command-tip.md'
-
-<CommandTip />

package/zh/apis/app/commands/index.md

@@ -1,12 +0,0 @@
----
-type: ref
----
-
-# 命令
-
-本节涵盖了所有命令。
-
-
-
-
-

package/zh/apis/app/commands/inspect.md

@@ -1,60 +0,0 @@
----
-sidebar_position: 7
----
-
-```
-Usage: modern inspect [options]
-
-Options:
-  --env <env>           查看指定环境下的配置 (default: "development")
-  --output <output>     指定在 dist 目录下输出的路径 (default: "/")
-  --verbose             在结果中展示函数的完整内容
-  -c --config <config>  指定配置文件路径，可以为相对路径或绝对路径
-  -h, --help            显示命令帮助
-```
-
-`modern inspect` 命令，用于查看项目的 [Modern.js Builder 配置](https://modernjs.dev/builder/zh/guide/basic/builder-config.html) 以及 webpack 配置。
-
-在项目根目录下执行命令 `npx modern inspect` 后，会在项目的 `dist` 目录生成以下文件：
-
-- `builder.config.js`: 表示在构建时使用的 Modern.js Builder 配置。
-- `webpack.config.web.js`: 表示在构建时使用的 webpack 配置。
-
-```bash
-➜ npx modern inspect
-
-Inspect config succeed, open following files to view the content:
-
-  - Builder Config: /root/my-project/dist/builder.config.js
-  - Webpack Config (web): /root/my-project/dist/webpack.config.web.js
-```
-
-## 指定环境
-
-默认情况下，inspect 命令会输出开发环境的配置，你可以添加 `--env production` 选项来输出生产环境的配置：
-
-```bash
-modern inspect --env production
-```
-
-## 完整内容
-
-默认情况下，inspect 命令会省略配置对象中的函数内容，你可以添加 `--verbose` 选项来输出函数的完整内容：
-
-```bash
-modern inspect --verbose
-```
-
-## SSR 构建配置
-
-如果项目开启了 SSR 能力，则在 `dist` 目录会另外生成一份 `webpack.config.node.js` 文件，对应 SSR 构建时的 webpack 配置。
-
-```bash
-➜ npx modern inspect
-
-Inspect config succeed, open following files to view the content:
-
-  - Builder Config: /root/my-project/dist/builder.config.js
-  - Webpack Config (web): /root/my-project/dist/webpack.config.web.js
-  - Webpack Config (node): /root/my-project/dist/webpack.config.node.js
-```

package/zh/apis/app/commands/lint.md

@@ -1,22 +0,0 @@
----
-sidebar_position: 4
-title: lint
----
-
-```bash
-Usage: modern lint [options] [...files]
-
-lint and fix source files
-
-Options:
-  --no-fix    disable auto fix source file
-  -h, --help  display help for command
-```
-
-运行 `ESLint` 检查代码语法情况。通常情况下，我们只需要在 `git commit` 阶段通过 `lint-staged` 检查本次提交修改的部分代码。
-
-* `--no-fix` 参数设置后可以关闭自动修复 lint 错误代码的能力。
-
-import CommandTip from '@site-docs/components/command-tip.md'
-
-<CommandTip />

package/zh/apis/app/commands/new.md

@@ -1,56 +0,0 @@
----
-sidebar_position: 2
----
-
-```bash
-Usage: modern new [options]
-
-应用工程中执行生成器
-
-Options:
-  -d, --debug            开启 Debug 模式，打印调试日志信息 (default: false)
-  -c, --config <config>  生成器运行默认配置(JSON 字符串)
-  --dist-tag <tag>       生成器使用特殊的 npm Tag 版本
-  --registry             生成器运行过程中定制 npm Registry
-  -h, --help             显示命令帮助
-```
-
-`modern new` 命令用于在已有项目中添加项目元素。
-
-比如添加应用入口、启用启用一些可选功能如 Tailwind CSS、微前端开发模式等。
-
-import CommandTip from '@site-docs/components/command-tip.md'
-
-<CommandTip />
-
-### 添加入口
-
-在应用工程中，执行 `new` 命令添加入口如下：
-
-```bash
-$ npx modern new
-? 请选择你想要的操作 创建工程元素
-? 创建工程元素 新建「应用入口」
-? 请填写入口名称 entry
-```
-
-### 启用可选功能
-
-在应用工程中，执行 `new` 命令启用可选能力如下：
-
-```bash
-$ npx modern new
-? 请选择你想要的操作 启用可选功能
-? 启用可选功能 (Use arrow keys)
-❯ 启用 Tailwind CSS 支持
-  启用「BFF」功能
-  启用「微前端」模式
-  启用「单元测试 / 集成测试」功能
-  启用「Visual Testing (Storybook)」模式
-```
-
-:::caution 注意
-`--config` 参数对应参数值需要使用 JSON 字符串。
-
-pnpm 暂不支持使用 JSON 字符串作为参数值，可使用 `npm new` 开启相关功能。【[相关 Issue](https://github.com/pnpm/pnpm/issues/3876)】
-:::

package/zh/apis/app/commands/serve.md

@@ -1,32 +0,0 @@
----
-sidebar_position: 6
----
-
-```bash
-Usage: modern serve [options]
-
-run server
-
-Options:
-  -c --config <config>  指定配置文件路径，可以为相对路径或绝对路径
-  -h, --help            显示命令帮助
-  --api-only            仅启动 API 接口服务
-```
-
-通常使用 `modern serve` 命令在生产环境下启用应用工程, 需要提前执行 [`build`](/docs/apis/app/commands/build) 命令构建出对应产物。
-
-默认情况下，应用将会在 `localhost:8080` 启动，可以通过 `server.port` 修改 Server 端口号：
-
-```js
-export default defineConfig({
-  server: {
-    port: 8081,
-  }
-})
-```
-
-import CommandTip from '@site-docs/components/command-tip.md'
-
-<CommandTip />
-
-

package/zh/apis/app/commands/test.md

@@ -1,36 +0,0 @@
----
-sidebar_position: 3
----
-
-```bash
-Usage: modern test [options]
-
-Options:
-  -h, --help  显示命令帮助
-```
-
-:::caution 注意
-`modern test` 命令需要先通过 [`new`](/docs/apis/app/commands/new) 命令启用「单元测试 / 集成测试」功能
-:::
-
-`modern test` 命令会自动运行项目下的测试用例，效果如下：
-
-```bash
-$ npx modern test
- PASS  src/tests/index.test.ts
-  The add method
-    ✓ should work fine. (2ms)
-
-Test Suites: 1 passed, 1 total
-Tests:       1 passed, 1 total
-Snapshots:   0 total
-Time:        0.994 s, estimated 1 s
-```
-
-:::info 注
-`src` 和 `api` 目录下面 `*.test.(js|ts)` 都会默认识别为测试用例。
-:::
-
-import CommandTip from '@site-docs/components/command-tip.md'
-
-<CommandTip />

package/zh/apis/app/commands/upgrade.md

@@ -1,21 +0,0 @@
----
-sidebar_position: 8
----
-
-```
-Usage: modern upgrade [options]
-
-升级 Modern.js 到最新版本
-
-Options:
-  --registry <registry>  定制 npm registry (default: "")
-  -d,--debug             开启 Debug 模式，打印调试日志信息 (default: false)
-  --cwd <cwd>            项目路径 (default: "")
-  -h, --help             display help for command
-```
-
-在项目根目录下执行命令 `npx modern upgrade`，会默认将当前执行命令项目的 `package.json` 中的 Modern.js 相关依赖更新至最新版本。
-
-:::info
-命令在 `@modern-js/app-tools` 版本 >= 1.17.0 提供，之前版本可使用 `npx @modern-js/upgrade` 进行升级。
-:::