@modern-js/main-doc 2.22.1 → 2.23.1
Sign up to get free protection for your applications and to get access to all the features.
- package/CHANGELOG.md +45 -0
- package/docs/en/apis/app/commands.mdx +5 -5
- package/docs/en/apis/app/hooks/config/storybook.mdx +24 -0
- package/docs/en/apis/app/hooks/src/stories.mdx +1 -1
- package/docs/en/apis/app/runtime/core/bootstrap.mdx +5 -5
- package/docs/en/apis/app/runtime/core/use-loader.mdx +2 -2
- package/docs/en/apis/app/runtime/core/use-module-apps.mdx +2 -2
- package/docs/en/apis/app/runtime/core/use-runtime-context.mdx +1 -1
- package/docs/en/apis/app/runtime/testing/render.mdx +1 -1
- package/docs/en/components/bff-proxy-path-rewrite.mdx +16 -0
- package/docs/en/components/bff-proxy-principle.mdx +1 -0
- package/docs/en/components/enable-bff-caution.mdx +3 -0
- package/docs/en/components/global-proxy-config.mdx +33 -13
- package/docs/en/configure/app/bff/enable-handle-web.mdx +5 -5
- package/docs/en/configure/app/bff/prefix.mdx +6 -6
- package/docs/en/configure/app/bff/proxy.mdx +19 -30
- package/docs/en/configure/app/builder-plugins.mdx +1 -1
- package/docs/en/configure/app/plugins.mdx +19 -19
- package/docs/en/configure/app/runtime/intro.mdx +28 -4
- package/docs/en/configure/app/runtime/master-app.mdx +1 -1
- package/docs/en/configure/app/runtime/router.mdx +2 -2
- package/docs/en/configure/app/server/base-url.mdx +4 -4
- package/docs/en/configure/app/server/enable-framework-ext.mdx +4 -4
- package/docs/en/configure/app/server/port.mdx +6 -6
- package/docs/en/configure/app/server/public-routes.mdx +5 -5
- package/docs/en/configure/app/server/routes.mdx +13 -13
- package/docs/en/configure/app/server/ssr-by-entries.mdx +4 -4
- package/docs/en/configure/app/server/ssr.mdx +5 -5
- package/docs/en/configure/app/testing/transformer.mdx +4 -8
- package/docs/en/configure/app/usage.mdx +5 -5
- package/docs/en/guides/advanced-features/code-split.mdx +15 -14
- package/docs/en/guides/advanced-features/compatibility.mdx +3 -24
- package/docs/en/guides/advanced-features/rspack-start.mdx +0 -1
- package/docs/en/guides/advanced-features/ssr.mdx +2 -2
- package/docs/en/guides/advanced-features/testing.mdx +8 -7
- package/docs/en/guides/advanced-features/using-storybook.mdx +44 -0
- package/docs/en/guides/advanced-features/web-server.mdx +16 -16
- package/docs/en/guides/basic-features/alias.mdx +11 -9
- package/docs/en/guides/basic-features/env-vars.mdx +14 -14
- package/docs/en/guides/basic-features/html.mdx +41 -43
- package/docs/en/guides/basic-features/mock.mdx +10 -10
- package/docs/en/guides/topic-detail/framework-plugin/implement.mdx +4 -4
- package/docs/en/guides/topic-detail/framework-plugin/introduction.mdx +1 -1
- package/docs/en/guides/troubleshooting/cli.mdx +13 -13
- package/docs/en/guides/troubleshooting/dependencies.mdx +25 -25
- package/docs/en/tutorials/first-app/c03-css.mdx +1 -1
- package/docs/zh/apis/app/commands.mdx +4 -4
- package/docs/zh/apis/app/hooks/config/storybook.mdx +24 -0
- package/docs/zh/apis/app/hooks/src/stories.mdx +1 -1
- package/docs/zh/apis/app/runtime/testing/render.mdx +1 -1
- package/docs/zh/components/bff-proxy-path-rewrite.mdx +16 -0
- package/docs/zh/components/bff-proxy-principle.mdx +1 -0
- package/docs/zh/components/enable-bff-caution.mdx +4 -0
- package/docs/zh/components/global-proxy-config.mdx +35 -11
- package/docs/zh/configure/app/bff/enable-handle-web.mdx +3 -3
- package/docs/zh/configure/app/bff/prefix.mdx +2 -3
- package/docs/zh/configure/app/bff/proxy.mdx +11 -21
- package/docs/zh/configure/app/runtime/intro.mdx +1 -1
- package/docs/zh/configure/app/server/base-url.mdx +1 -1
- package/docs/zh/configure/app/server/public-routes.mdx +2 -2
- package/docs/zh/configure/app/server/routes.mdx +2 -2
- package/docs/zh/configure/app/server/ssr-by-entries.mdx +3 -3
- package/docs/zh/configure/app/server/ssr.mdx +1 -1
- package/docs/zh/configure/app/testing/transformer.mdx +6 -3
- package/docs/zh/configure/app/usage.mdx +9 -9
- package/docs/zh/guides/advanced-features/code-split.mdx +13 -12
- package/docs/zh/guides/advanced-features/rspack-start.mdx +0 -1
- package/docs/zh/guides/advanced-features/ssr.mdx +2 -2
- package/docs/zh/guides/advanced-features/testing.mdx +4 -4
- package/docs/zh/guides/advanced-features/using-storybook.mdx +44 -0
- package/docs/zh/guides/basic-features/alias.mdx +5 -3
- package/docs/zh/guides/basic-features/html.mdx +9 -9
- package/docs/zh/guides/basic-features/mock.mdx +2 -2
- package/docs/zh/guides/topic-detail/_category_.json +1 -1
- package/docs/zh/guides/troubleshooting/cli.mdx +1 -1
- package/docs/zh/guides/troubleshooting/dependencies.mdx +1 -1
- package/package.json +7 -6
@@ -14,7 +14,7 @@ Modern.js 允许在 JS 和 CSS 中使用别名导入自定义目录下的模块
|
|
14
14
|
```
|
15
15
|
|
16
16
|
:::info
|
17
|
-
|
17
|
+
在开启可选功能时,new 命令也会动态的添加内置别名,例如启用 BFF 时默认会添加 `@api` 别名。
|
18
18
|
|
19
19
|
:::
|
20
20
|
|
@@ -27,7 +27,7 @@ Modern.js 允许在 JS 和 CSS 中使用别名导入自定义目录下的模块
|
|
27
27
|
│ │ └── base.css
|
28
28
|
│ └── utils
|
29
29
|
│ └── index.ts
|
30
|
-
|
30
|
+
└── App.tsx
|
31
31
|
```
|
32
32
|
|
33
33
|
`src/App.tsx` 中写法如下:
|
@@ -37,7 +37,9 @@ import utils from '@/src/common/utils';
|
|
37
37
|
import '@/src/common/styles/base.css';
|
38
38
|
```
|
39
39
|
|
40
|
-
Modern.js 也提供了自定义别名的方式,以添加 `@common`
|
40
|
+
Modern.js 也提供了自定义别名的方式,以添加 `@common` 别名为例:
|
41
|
+
|
42
|
+
对于 TypeScript 项目,只需要在项目根目录 `tsconfig.json` 下配置 `compilerOptions.paths`:
|
41
43
|
|
42
44
|
```json
|
43
45
|
{
|
@@ -9,7 +9,7 @@ Modern.js 提供了 **JSX 语法**和 **HTML(EJS) 语法**两种方式用于自
|
|
9
9
|
|
10
10
|
## JSX 语法
|
11
11
|
|
12
|
-
Modern.js 约定,在 `src/`
|
12
|
+
Modern.js 约定,在 `src/` 或入口目录下,可以创建 `Document.[jt]sx` 文件并默认导出组件,该组件的渲染结果可以作为入口的 HTML 模板。
|
13
13
|
|
14
14
|
例如以下目录结构:
|
15
15
|
|
@@ -27,17 +27,17 @@ Modern.js 约定,在 `src/` 目录下,或在入口目录下,可以创建 `
|
|
27
27
|
|
28
28
|
`entry-a` 会优先使用当前入口下的 `Docoument.[jt]sx` 文件。如果当前入口没有 `Document.[jt]sx` 文件,例如 `entry-b`,则会查找根目录下的 `Document.[jt]sx` 文件。
|
29
29
|
|
30
|
-
|
30
|
+
如果未找到,将会使用 Modern.js 的默认模板。
|
31
31
|
|
32
32
|
### HTML 组件
|
33
33
|
|
34
|
-
Modern.js 提供了一些列渲染页面的组件,用来帮助开发者生成模板,可以从 `@modern-js/runtime/document`
|
34
|
+
Modern.js 提供了一些列渲染页面的组件,用来帮助开发者生成模板,可以从 `@modern-js/runtime/document` 中使用这些组件:
|
35
35
|
|
36
36
|
```tsx
|
37
37
|
import { Html, Body, Root, Head, Scripts } from '@modern-js/runtime/document';
|
38
38
|
```
|
39
39
|
|
40
|
-
|
40
|
+
这些组件分别用于渲染:
|
41
41
|
|
42
42
|
- `Html`:提供原生 HTML Element 的能力,并能默认渲染开发者未添加的必须的组件。`<Head>` 和 `<Body>` 是必须要存在的,其它组件可以按需选择合适的组件进行组装。
|
43
43
|
|
@@ -57,10 +57,10 @@ import { Html, Body, Root, Head, Scripts } from '@modern-js/runtime/document';
|
|
57
57
|
|
58
58
|
Modern.js 也提供了 `DocumentContext` 来提供一些配置、环境参数,方便直接获取。主要以下参数:
|
59
59
|
|
60
|
-
- `processEnv`:提供构建时的 `process.env
|
61
|
-
- `config`:Modern.js 项目的配置。目前只暴露出 output
|
62
|
-
- `entryName
|
63
|
-
- `templateParams`:HTML
|
60
|
+
- `processEnv`:提供构建时的 `process.env`。
|
61
|
+
- `config`:Modern.js 项目的配置。目前只暴露出 output 相关的配置。
|
62
|
+
- `entryName`:当前的入口名。
|
63
|
+
- `templateParams`:HTML 模板的参数(为了兼容传统模板,不推荐使用)。
|
64
64
|
|
65
65
|
### 示例
|
66
66
|
|
@@ -151,7 +151,7 @@ export default function Document(): React.ReactElement {
|
|
151
151
|
|
152
152
|
Modern.js 也支持 HTML 语法。默认情况下,Modern.js 的应用工程中会内置一份 HTML 模板,用于生成 HTML 代码。
|
153
153
|
|
154
|
-
基于 HTML 语法的模板,Modern.js
|
154
|
+
基于 HTML 语法的模板,Modern.js 提供了**自定义 HTML 片段**和**完全自定义 HTML 模板**两种方式来自定义模板。
|
155
155
|
|
156
156
|
### 自定义 HTML 片段
|
157
157
|
|
@@ -6,7 +6,7 @@ sidebar_position: 6
|
|
6
6
|
|
7
7
|
Modern.js 提供了快速生成 Mock 数据的功能,能够让前端独立自主开发,不被后端接口阻塞。
|
8
8
|
|
9
|
-
## Mock
|
9
|
+
## 启用 Mock
|
10
10
|
|
11
11
|
约定当 `config/mock` 目录下存在 `index.[jt]s` 时,会自动开启 Mock 功能,如下:
|
12
12
|
|
@@ -63,7 +63,7 @@ module.exports = {
|
|
63
63
|
|
64
64
|
:::
|
65
65
|
|
66
|
-
##
|
66
|
+
## 延迟响应
|
67
67
|
|
68
68
|
- 可以使用浏览器「 弱网模拟 」的功能实现。
|
69
69
|
- 可以通过 `setTimeout` 为单个接口设置延迟,例如:
|
@@ -105,6 +105,6 @@ Type '{}' is not assignable to type 'ReactNode'.
|
|
105
105
|
**Modern.js 框架推荐使用的 React 版本为 >= 18.0.0**,并且不同功能对 React 版本的要求有所不同。
|
106
106
|
|
107
107
|
- 如果你在使用 React 17,那么部分框架功能将无法使用,比如 Steaming SSR,因为它依赖 React 18 提供的新特性。
|
108
|
-
- 如果你仍然在使用 React 16,那么将无法使用 Modern.js 的运行时或服务端能力。你可以考虑使用 Modern.js 的构建模式,即只使用 Modern.js
|
108
|
+
- 如果你仍然在使用 React 16,那么将无法使用 Modern.js 的运行时或服务端能力。你可以考虑使用 Modern.js 的构建模式,即只使用 Modern.js 的构建能力,这种情况可以继续使用 React 16。
|
109
109
|
|
110
110
|
在 Modern.js 未来的 major 版本中,我们会逐步移除对 React 16 和 React 17 的支持。因此,请尽快升级到 React 18 以上版本。
|
package/package.json
CHANGED
@@ -15,13 +15,14 @@
|
|
15
15
|
"modern",
|
16
16
|
"modern.js"
|
17
17
|
],
|
18
|
-
"version": "2.
|
18
|
+
"version": "2.23.1",
|
19
19
|
"publishConfig": {
|
20
20
|
"registry": "https://registry.npmjs.org/",
|
21
|
-
"access": "public"
|
21
|
+
"access": "public",
|
22
|
+
"provenance": true
|
22
23
|
},
|
23
24
|
"peerDependencies": {
|
24
|
-
"@modern-js/builder-doc": "^2.
|
25
|
+
"@modern-js/builder-doc": "^2.23.1"
|
25
26
|
},
|
26
27
|
"devDependencies": {
|
27
28
|
"classnames": "^2",
|
@@ -33,9 +34,9 @@
|
|
33
34
|
"fs-extra": "^10",
|
34
35
|
"@types/node": "^16",
|
35
36
|
"@types/fs-extra": "^9",
|
36
|
-
"@modern-js/builder-doc": "2.
|
37
|
-
"@modern-js/doc-tools": "2.
|
38
|
-
"@modern-js/doc-plugin-auto-sidebar": "2.
|
37
|
+
"@modern-js/builder-doc": "2.23.1",
|
38
|
+
"@modern-js/doc-tools": "2.23.1",
|
39
|
+
"@modern-js/doc-plugin-auto-sidebar": "2.23.1"
|
39
40
|
},
|
40
41
|
"scripts": {
|
41
42
|
"dev": "modern dev",
|