@modern-js/main-doc 0.0.0-next-20221123182933 → 0.0.0-next-20221124071519
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +3 -2
- package/en/docusaurus-plugin-content-docs/current/apis/app/commands/_category_.json +1 -1
- package/en/docusaurus-plugin-content-docs/current/apis/app/commands/build.md +10 -10
- package/en/docusaurus-plugin-content-docs/current/apis/app/commands/dev.md +7 -7
- package/en/docusaurus-plugin-content-docs/current/apis/app/commands/index.md +2 -2
- package/en/docusaurus-plugin-content-docs/current/apis/app/commands/inspect.md +15 -15
- package/en/docusaurus-plugin-content-docs/current/apis/app/commands/lint.md +2 -2
- package/en/docusaurus-plugin-content-docs/current/apis/app/commands/new.md +15 -15
- package/en/docusaurus-plugin-content-docs/current/apis/app/commands/start.md +5 -5
- package/en/docusaurus-plugin-content-docs/current/apis/app/commands/test.md +5 -5
- package/en/docusaurus-plugin-content-docs/current/apis/app/commands/upgrade.md +7 -9
- package/en/docusaurus-plugin-content-docs/current/apis/app/hooks/_category_.json +1 -1
- package/en/docusaurus-plugin-content-docs/current/apis/app/hooks/api/framework/lambda.md +22 -47
- package/en/docusaurus-plugin-content-docs/current/apis/app/hooks/api/functions/api.md +46 -18
- package/en/docusaurus-plugin-content-docs/current/apis/app/hooks/api/functions/app.md +2 -2
- package/en/docusaurus-plugin-content-docs/current/apis/app/hooks/api/functions/common.md +4 -4
- package/en/docusaurus-plugin-content-docs/current/apis/app/hooks/api/test.md +2 -4
- package/en/docusaurus-plugin-content-docs/current/apis/app/hooks/config/html.md +2 -4
- package/en/docusaurus-plugin-content-docs/current/apis/app/hooks/config/icon.md +3 -5
- package/en/docusaurus-plugin-content-docs/current/apis/app/hooks/config/mock.md +1 -7
- package/en/docusaurus-plugin-content-docs/current/apis/app/hooks/config/public.md +11 -13
- package/en/docusaurus-plugin-content-docs/current/apis/app/hooks/config/storybook.md +3 -5
- package/en/docusaurus-plugin-content-docs/current/apis/app/hooks/config/upload.md +14 -20
- package/en/docusaurus-plugin-content-docs/current/apis/app/hooks/index.md +2 -7
- package/en/docusaurus-plugin-content-docs/current/apis/app/hooks/modern-config.md +2 -4
- package/en/docusaurus-plugin-content-docs/current/apis/app/hooks/server/index_.md +5 -3
- package/en/docusaurus-plugin-content-docs/current/apis/app/hooks/server/test.md +2 -4
- package/en/docusaurus-plugin-content-docs/current/apis/app/hooks/shared.md +1 -3
- package/en/docusaurus-plugin-content-docs/current/apis/app/hooks/src/app.md +7 -3
- package/en/docusaurus-plugin-content-docs/current/apis/app/hooks/src/index_.md +7 -8
- package/en/docusaurus-plugin-content-docs/current/apis/app/hooks/src/pages.md +40 -43
- package/en/docusaurus-plugin-content-docs/current/apis/app/hooks/src/stories.md +3 -5
- package/en/docusaurus-plugin-content-docs/current/apis/app/hooks/src/test.md +3 -3
- package/en/docusaurus-plugin-content-docs/current/apis/app/overview.md +3 -2
- package/en/docusaurus-plugin-content-docs/current/apis/app/runtime/app/define-config.md +2 -2
- package/en/docusaurus-plugin-content-docs/current/apis/app/runtime/default-alias.md +0 -1
- package/en/docusaurus-plugin-content-docs/current/apis/app/runtime/env.md +1 -1
- package/en/docusaurus-plugin-content-docs/current/apis/app/runtime/model/model_.md +2 -2
- package/en/docusaurus-plugin-content-docs/current/apis/app/runtime/testing/act.md +1 -1
- package/en/docusaurus-plugin-content-docs/current.json +10 -10
- package/package.json +3 -3
- package/zh/apis/app/commands/build.md +1 -1
- package/zh/apis/app/commands/index.md +1 -1
- package/zh/apis/app/commands/lint.md +1 -1
- package/zh/apis/app/commands/upgrade.md +0 -2
- package/zh/apis/app/hooks/api/framework/_category_.json +1 -1
- package/zh/apis/app/hooks/api/framework/lambda.md +7 -32
- package/zh/apis/app/hooks/api/functions/_category_.json +1 -1
- package/zh/apis/app/hooks/api/functions/api.md +28 -1
- package/zh/apis/app/hooks/api/functions/common.md +2 -4
- package/zh/apis/app/hooks/api/test.md +1 -3
- package/zh/apis/app/hooks/config/html.md +0 -2
- package/zh/apis/app/hooks/config/icon.md +1 -1
- package/zh/apis/app/hooks/config/mock.md +1 -7
- package/zh/apis/app/hooks/config/public.md +1 -3
- package/zh/apis/app/hooks/config/storybook.md +1 -3
- package/zh/apis/app/hooks/config/upload.md +0 -6
- package/zh/apis/app/hooks/modern-config.md +1 -3
- package/zh/apis/app/hooks/server/index_.md +4 -4
- package/zh/apis/app/hooks/server/test.md +1 -1
- package/zh/apis/app/hooks/shared.md +1 -2
- package/zh/apis/app/hooks/src/app.md +7 -3
- package/zh/apis/app/hooks/src/index_.md +1 -1
- package/zh/apis/app/hooks/src/pages.md +2 -3
- package/zh/apis/app/hooks/src/stories.md +1 -1
- package/zh/apis/app/overview.md +1 -1
- package/en/docusaurus-plugin-content-docs/current/apis/app/hooks/api/framework/app.md +0 -100
- package/en/docusaurus-plugin-content-docs/current/apis/app/hooks/src/eslint.md +0 -9
- package/zh/apis/app/hooks/api/framework/app.md +0 -100
- package/zh/apis/app/hooks/src/eslint.md +0 -9
@@ -3,28 +3,26 @@ title: public/
|
|
3
3
|
sidebar_position: 3
|
4
4
|
---
|
5
5
|
|
6
|
-
|
6
|
+
Static resource files in any format can be placed in the `public/`, and the files will be Served under the web application domain name.
|
7
7
|
|
8
|
-
|
8
|
+
## Description
|
9
9
|
|
10
|
-
|
10
|
+
The routing of files to be served is based on the convention of the file system. `public/` is the root directory, which corresponds to the root path of the Web application.
|
11
11
|
|
12
|
-
|
12
|
+
For example, the `config/public/sdk/index.js` file will be Served under `${domain}/sdk/index.js` after deployment.
|
13
13
|
|
14
|
-
|
14
|
+
## Scene
|
15
15
|
|
16
|
-
|
16
|
+
For example, `robots.txt`, `auth.xml` and other authentication file.
|
17
17
|
|
18
|
-
|
19
|
-
|
20
|
-
或者是给其他业务方(要求路由不变)的 SDK,也可以是无需入口的 HTML 文件等。
|
18
|
+
SDK (requiring the same routing) for other business, or an HTML file for static host.
|
21
19
|
|
22
20
|
:::info
|
23
|
-
|
21
|
+
For static resources (such as SVG pictures) that need to be referenced by import in the source code, it is recommended to put them in the `src/assets/` for management.
|
24
22
|
:::
|
25
23
|
|
26
|
-
##
|
24
|
+
## Compression
|
27
25
|
|
28
|
-
|
26
|
+
If the file is a `.js` file, it will be automatically compressed when the production environment is built.
|
29
27
|
|
30
|
-
|
28
|
+
If the file ends with `.min.js`, it will not compression.
|
@@ -3,12 +3,10 @@ title: storybook/
|
|
3
3
|
sidebar_position: 7
|
4
4
|
---
|
5
5
|
|
6
|
-
|
6
|
+
Modern.js.js supports debugging with Storybook. When you need to configure Storybook, configure it in the `config/storybook/`.
|
7
7
|
|
8
|
-
|
9
|
-
|
10
|
-
Storybook 配置请查看:[Storybook 配置](https://storybook.js.org/docs/react/configure/overview)
|
8
|
+
For detail, see [Storybook](https://storybook.js.org/docs/react/configure/overview).
|
11
9
|
|
12
10
|
:::info
|
13
|
-
|
11
|
+
Debugging with Storybook requires executing the `new` command to enable the 「Visual Testing (Storybook)」 mode feature.
|
14
12
|
:::
|
@@ -3,46 +3,40 @@ title: upload/
|
|
3
3
|
sidebar_position: 4
|
4
4
|
---
|
5
5
|
|
6
|
-
|
6
|
+
Static resource files in any format can be placed in the `upload/`.
|
7
7
|
|
8
|
-
|
8
|
+
## Description
|
9
9
|
|
10
|
-
|
10
|
+
In the development environment, the static resource files in this directory will be hosted in the '/upload' path. After building the application product, the files in this directory will be copied to the dist path.
|
11
11
|
|
12
|
-
|
12
|
+
This file convention is mainly used for developers to use plugins to upload static resource files to the CDN.
|
13
13
|
|
14
|
-
|
14
|
+
## Scene
|
15
15
|
|
16
|
-
|
16
|
+
For example, the SDK used by the project such as `google-analysis.js` (usually requires http caching).
|
17
17
|
|
18
|
-
|
18
|
+
Images, font files, generic CSS, etc.
|
19
19
|
|
20
|
-
|
20
|
+
## Compression
|
21
21
|
|
22
|
-
|
22
|
+
If the file is a `.js` file, it will be automatically compressed when the production environment is built.
|
23
23
|
|
24
|
-
|
24
|
+
If the file ends with `.min.js`, it will not compression.
|
25
25
|
|
26
|
-
|
26
|
+
## More Usage
|
27
27
|
|
28
|
-
|
29
|
-
|
30
|
-
## 更多用法
|
31
|
-
|
32
|
-
不论是在[自定义 HTML](/docs/guides/basic-features/html) 中,或是在 [`config/public/`](/docs/apis/app/hooks/config/public) 下的任意 HTML 文件中,都可以直接使用 HTML 标签引用 `config/upload/` 目录下的资源:
|
28
|
+
Whether in [custom HTML](/docs/guides/basic-features/html), or in any HTML file under ['config/public/'](/docs/apis/app/hooks/config/public), you can directly use the HTML tag to refer to the resources in the `config/upload/`:
|
33
29
|
|
34
30
|
```html
|
35
31
|
<script src="/upload/index.js"></script>
|
36
32
|
```
|
37
33
|
|
38
|
-
|
34
|
+
if [`output.assetPrefix`](/docs/configure/app/output/asset-prefix) is configured,add this prefix directly using template syntax:
|
39
35
|
|
40
36
|
```html
|
41
37
|
<script src="<%=assetPrefix %>/upload/index.js"></script>
|
42
38
|
```
|
43
39
|
|
44
40
|
:::info
|
45
|
-
Modern.js
|
46
|
-
|
47
|
-
因为 Modern.js 不推荐在 `public/` 中放 JS、CSS 这类资源文件,可以将它们直接放置在 `upload/` 目录下。
|
41
|
+
Modern.js does not support the use files under `upload/` in `config/public/*.css` via URL.
|
48
42
|
:::
|
@@ -3,8 +3,6 @@ title: modern.config.js
|
|
3
3
|
sidebar_position: 8
|
4
4
|
---
|
5
5
|
|
6
|
-
|
6
|
+
Modern.js config file, through which you can confiured all aspects of the current project.
|
7
7
|
|
8
|
-
|
9
|
-
|
10
|
-
了解配置的具体用法,请参考 [配置使用](/docs/configure/app/usage)。
|
8
|
+
For detail, see [configure](/docs/configure/app/usage).
|
@@ -3,10 +3,12 @@ title: index.[tj]s
|
|
3
3
|
sidebar_position: 1
|
4
4
|
---
|
5
5
|
|
6
|
-
|
6
|
+
A file that extends the Modern.js Web Server, to add a Hook or Middleware to the Web Server that the project uses.
|
7
7
|
|
8
|
-
|
8
|
+
It can intercept requests and responses, authenticate and role, request preprocessing, exception bottom-up, etc.;
|
9
|
+
|
10
|
+
It can also be inserted logic into the built-in processing handler (including route matching, resource addressing, header injection, page rendering, static web hosting).
|
9
11
|
|
10
12
|
:::info
|
11
|
-
|
13
|
+
For detail, see [Hook](/docs/apis/app/runtime/web-server/hook) & [Middleware](/docs/apis/app/runtime/web-server/middleware)。
|
12
14
|
:::
|
@@ -3,10 +3,8 @@ title: test.[tj]s
|
|
3
3
|
sidebar_position: 2
|
4
4
|
---
|
5
5
|
|
6
|
-
|
7
|
-
|
8
|
-
应用项目支持对扩展 Web Server 逻辑进行测试,可直接在项目 server 目录下创建后缀为 `.test.[tj]s` 文件进行编写测试用例。
|
6
|
+
App's Web Server test file,support for writing test cases in the `server/` directory which file with suffix `.test.[tj]s`.
|
9
7
|
|
10
8
|
:::info
|
11
|
-
|
9
|
+
To use unit test and integration test, you need to execute the `new` command in advance to enable the `unit test/integration test`.
|
12
10
|
:::
|
@@ -3,6 +3,4 @@ title: shared/
|
|
3
3
|
sidebar_position: 5
|
4
4
|
---
|
5
5
|
|
6
|
-
|
7
|
-
|
8
|
-
在项目中同时用到了 BFF 和扩展 Web Server 功能,并且它们之间存在一些公共服务端代码时,可将这些公共代码放到 shared 目录下。
|
6
|
+
Shared directory. When the project has common code under `api/`, `server/`, `src/`, put the code under this directory rather then import directly.
|
@@ -3,13 +3,14 @@ title: App.[tj]sx
|
|
3
3
|
sidebar_position: 1
|
4
4
|
---
|
5
5
|
|
6
|
-
|
6
|
+
Entry identifier if App want control route by code.
|
7
7
|
|
8
|
-
|
8
|
+
`App.[tj]sx` is not the actual App entry, Modern.js will auto generate the entry file, the content is roughly as follows:
|
9
9
|
|
10
10
|
```js
|
11
11
|
import React from 'react';
|
12
12
|
import { createApp, bootstrap } from '@modern-js/runtime';
|
13
|
+
// App.[jt]sx
|
13
14
|
import App from '@_modern_js_src/App';
|
14
15
|
import { state } from '@modern-js/runtime/plugins';
|
15
16
|
import { immer, effects, autoActions, devtools } from '@modern-js/runtime/model';
|
@@ -38,4 +39,7 @@ AppWrapper = render();
|
|
38
39
|
export default AppWrapper;;
|
39
40
|
```
|
40
41
|
|
41
|
-
|
42
|
+
:::note
|
43
|
+
In multi-entry App,each entry can have a `App.[jt]sx`, for detail, see [Entry](/docs/guides/concept/entries).
|
44
|
+
:::
|
45
|
+
|
@@ -3,13 +3,14 @@ title: index.[tj]s
|
|
3
3
|
sidebar_position: 3
|
4
4
|
---
|
5
5
|
|
6
|
-
|
6
|
+
Entry identifier if App want use custom entry. In most case, [`App.[tj]sx`](/docs/apis/app/hooks/src/app) hook file can already meet our needs.
|
7
7
|
|
8
|
-
|
8
|
+
When we need to add custom behavior before `bootstrap` or completely take over the webpack entry, we can place `index.[tj]s` in `src/` or entry directory. The following are discussed in two cases:
|
9
9
|
|
10
|
-
1. bootstrap 之前添加自定义行为:
|
11
10
|
|
12
|
-
|
11
|
+
1. add custom behavior before bootstrap
|
12
|
+
|
13
|
+
Just add default export under `src/index.[tj]s`:
|
13
14
|
|
14
15
|
```js title=src/index.js
|
15
16
|
import { bootstrap } from '@modern-js/runtime';
|
@@ -20,11 +21,9 @@ export default App => {
|
|
20
21
|
};
|
21
22
|
```
|
22
23
|
|
24
|
+
2. Fully take over the webpack entry
|
23
25
|
|
24
|
-
|
25
|
-
|
26
|
-
当 `src/index.[tj]sx?` 下没有默认导出函数时,该文件即为真正的 webpack 打包入口文件, 可以直接像使用 create-react-app 等脚手架一样组织代码:
|
27
|
-
|
26
|
+
When there is no default export function under `src/index.[tj]sx?`, this file is the real webpack entry file, and the code can be organized such as create-react-app:
|
28
27
|
|
29
28
|
```js title=src/index.jsx
|
30
29
|
import React from 'react';
|
@@ -3,12 +3,11 @@ title: pages/
|
|
3
3
|
sidebar_position: 2
|
4
4
|
---
|
5
5
|
|
6
|
-
|
6
|
+
Entry identifier if the application want uses file system-based routing.
|
7
7
|
|
8
|
-
|
8
|
+
When the entry is the **Pages entry** type, the files in the `pages/` directory will be analyzed to client side routing.
|
9
9
|
|
10
|
-
|
11
|
-
举例说明,例如以下目录结构:
|
10
|
+
For example, the following directory:
|
12
11
|
|
13
12
|
```bash
|
14
13
|
.
|
@@ -20,7 +19,7 @@ sidebar_position: 2
|
|
20
19
|
└── info.jsx
|
21
20
|
```
|
22
21
|
|
23
|
-
|
22
|
+
The generated route is configured as:
|
24
23
|
|
25
24
|
```bash
|
26
25
|
[
|
@@ -30,23 +29,21 @@ sidebar_position: 2
|
|
30
29
|
]
|
31
30
|
```
|
32
31
|
|
33
|
-
|
34
|
-
|
35
|
-
- 后缀不是 `.(j|t)sx?` 的文件。
|
36
|
-
- `.d.ts` 类型定义文件。
|
37
|
-
- 以 `.(test|spec|e2e).(j|t)sx?` 结尾的测试文件。
|
38
|
-
|
39
|
-
:::tip 提示
|
32
|
+
Files match the following conditions will not be treated as routing files:
|
40
33
|
|
41
|
-
|
34
|
+
- suffix is not `.(j|t)sx?`.
|
35
|
+
- `.d.ts` type definition file.
|
36
|
+
- test file suffix like `.(test|spec|e2e).(j|t)sx?`.
|
42
37
|
|
38
|
+
:::tip
|
39
|
+
it is recommended to write only the routing files in the `pages/`, and write the business logic to the independent features directory outside the `pages/`. In this way, most of the files in the pages directory will be routing files, and there is no need for additional filtering rules.
|
43
40
|
:::
|
44
41
|
|
45
|
-
###
|
42
|
+
### Dynamic Routing
|
46
43
|
|
47
|
-
|
44
|
+
Directories or files wrapped with `[]` are considered dynamic routing.
|
48
45
|
|
49
|
-
|
46
|
+
For example the following directory structure:
|
50
47
|
|
51
48
|
```bash
|
52
49
|
.
|
@@ -61,7 +58,7 @@ pages 目录下的文件满足以下条件的不会被当做路由文件
|
|
61
58
|
└── info.jsx
|
62
59
|
```
|
63
60
|
|
64
|
-
|
61
|
+
The generated route is configured as:
|
65
62
|
|
66
63
|
```js
|
67
64
|
[
|
@@ -73,13 +70,13 @@ pages 目录下的文件满足以下条件的不会被当做路由文件
|
|
73
70
|
]
|
74
71
|
```
|
75
72
|
|
76
|
-
|
73
|
+
Basis dynamic routing, it supports adding special routing suffixes `(*、?、+)`.
|
77
74
|
|
78
|
-
|
75
|
+
For example: `src/pages/users/[id]*.tsx` generate route `/users/:id*`
|
79
76
|
|
80
|
-
###
|
77
|
+
### Global Layout
|
81
78
|
|
82
|
-
|
79
|
+
When the entire App needs a global `layout`, it can be achieved through `pages/_app.tsx`, which as follows:
|
83
80
|
|
84
81
|
```js
|
85
82
|
import React from 'react';
|
@@ -94,9 +91,9 @@ export default const App = ({Component, ...pageProps}:{ Component: React.Compone
|
|
94
91
|
}
|
95
92
|
```
|
96
93
|
|
97
|
-
|
94
|
+
The above `Component` is the component to which the route is accessed.
|
98
95
|
|
99
|
-
|
96
|
+
For example the following directory structure:
|
100
97
|
|
101
98
|
```bash
|
102
99
|
.
|
@@ -108,26 +105,26 @@ export default const App = ({Component, ...pageProps}:{ Component: React.Compone
|
|
108
105
|
└── index.js
|
109
106
|
```
|
110
107
|
|
111
|
-
-
|
112
|
-
-
|
113
|
-
-
|
108
|
+
- access `/`, the `Component` is `pages/index.js`。
|
109
|
+
- access `/a`, the `Component` is `pages/a/index.js`。
|
110
|
+
- access `/a/b`, the `Component` is `pages/a/b/index.js`。
|
114
111
|
|
115
|
-
:::tip
|
112
|
+
:::tip Advantages
|
116
113
|
|
117
|
-
-
|
118
|
-
-
|
119
|
-
- ComponentDidCatch
|
120
|
-
-
|
114
|
+
- preserve the state of the global layout when the page changes.
|
115
|
+
- add global css.
|
116
|
+
- handle ComponentDidCatch error
|
117
|
+
- use `defineConfig`(/docs/apis/app/runtime/app/define-config) dynamic configuration runtime.
|
121
118
|
|
122
119
|
:::
|
123
120
|
|
124
|
-
###
|
121
|
+
### Partial Layout
|
125
122
|
|
126
|
-
|
123
|
+
When developing an App, where sub routes under the same route may share the layout.
|
127
124
|
|
128
|
-
|
125
|
+
For this scene, Modern.js convention, when there is a `_layout.js` in the directory, the routes can shared this layout.
|
129
126
|
|
130
|
-
|
127
|
+
For example the following directory structure:
|
131
128
|
|
132
129
|
```bash
|
133
130
|
└── pages
|
@@ -148,18 +145,18 @@ const ALayout = ({ Component, ...pageProps }) => {
|
|
148
145
|
export default ALayout;
|
149
146
|
```
|
150
147
|
|
151
|
-
Component
|
148
|
+
The Component props is the specific route, for example
|
152
149
|
|
153
|
-
-
|
154
|
-
- 访问 `/a/b
|
150
|
+
- access `/a`, the `Component` is `pages/a/index.js`。
|
151
|
+
- 访问 `/a/b`, the `Component` is `pages/a/b/index.js`。
|
155
152
|
|
156
|
-
|
153
|
+
In this way, you can use `pages/a/_layout.js` to display the routing common layout in the `a` directory.
|
157
154
|
|
158
155
|
### 404 路由
|
159
156
|
|
160
|
-
|
157
|
+
The convention `pages/404.[tj]sx` is the default 404 route.
|
161
158
|
|
162
|
-
|
159
|
+
For example the following directory structure:
|
163
160
|
|
164
161
|
```bash
|
165
162
|
.
|
@@ -170,7 +167,7 @@ Component 参数为访问具体路由对应的组件,例如
|
|
170
167
|
├── 404.js
|
171
168
|
```
|
172
169
|
|
173
|
-
|
170
|
+
the generated route is configured is as:
|
174
171
|
|
175
172
|
```bash
|
176
173
|
[
|
@@ -180,4 +177,4 @@ Component 参数为访问具体路由对应的组件,例如
|
|
180
177
|
]
|
181
178
|
```
|
182
179
|
|
183
|
-
|
180
|
+
All unmatched routes will match to `pages/404.[tj]s`。
|
@@ -3,12 +3,10 @@ title: "**/*.stories.[tj]sx"
|
|
3
3
|
sidebar_position: 7
|
4
4
|
---
|
5
5
|
|
6
|
-
|
6
|
+
App Storybook debug file. files in `src/` which suffix `*.stories.[tj]sx` are as debug files for Storybook.
|
7
7
|
|
8
|
-
|
9
|
-
|
10
|
-
在项目下执行 dev story 命令,支持使用这些文件在 Storybook 中对相关内容进行调试。
|
8
|
+
Execute the `dev story` command to debugging these files in the Storybook.
|
11
9
|
|
12
10
|
:::info
|
13
|
-
|
11
|
+
Using a Storybook requires executing `new` command to enable the 「Visual Testing (Storybook)」 mode.
|
14
12
|
:::
|
@@ -3,10 +3,10 @@ title: "**/*.test.[tj]sx?"
|
|
3
3
|
sidebar_position: 6
|
4
4
|
---
|
5
5
|
|
6
|
-
|
6
|
+
App test file.
|
7
7
|
|
8
|
-
|
8
|
+
The App supports the file suffixed with `.test.[tj]sx` under the `src/` to write test cases.
|
9
9
|
|
10
10
|
:::info
|
11
|
-
|
11
|
+
To use unit test and integration test, you need to execute the `new` command in advance to enable the `unit test/integration test`.
|
12
12
|
:::
|
@@ -2,8 +2,9 @@
|
|
2
2
|
sidebar_position: 0
|
3
3
|
---
|
4
4
|
|
5
|
-
#
|
6
|
-
|
5
|
+
# Overview
|
6
|
+
|
7
|
+
This section covers all APIs in `@modern-js/app-tools`.
|
7
8
|
|
8
9
|
import OverviewNav from '@site/src/components/OverviewNav';
|
9
10
|
import sidebarData from '@site/plugins/overview-loader!@site/plugins/overview-data.json';
|
@@ -45,7 +45,7 @@ REACT_APP_FOO=123 BAR=456 pnpm run dev
|
|
45
45
|
|
46
46
|
### Specify Via File
|
47
47
|
|
48
|
-
Create a `.env` file in the
|
48
|
+
Create a `.env` file in the project with custom environment variables:
|
49
49
|
|
50
50
|
```env
|
51
51
|
REACT_APP_FOO=123
|
@@ -56,8 +56,8 @@ const fooModel = model('foo').define({
|
|
56
56
|
|
57
57
|
`function define((context: Context, utils: Utils) => ModelDesc): Model;`
|
58
58
|
|
59
|
-
- context
|
60
|
-
- utils:
|
59
|
+
- `context`: Reduck Context, can get underlying `store` object. `store` support all Redux Store [API](https://redux.js.org/api/store), also mounts the `use` method for consuming the Model, and the `unmount` method for unmounting the Model.
|
60
|
+
- utils: commonly used tool like `use`、`onMount`. `use` is the same as `store.use`,`onMount` is the hook function after the Model is mounted.
|
61
61
|
|
62
62
|
<!-- TODO: @anchao 调整类型 -->
|
63
63
|
```ts
|
@@ -12,7 +12,7 @@ import { act } from '@modern-js/runtime/testing';
|
|
12
12
|
|
13
13
|
## Function Signature
|
14
14
|
|
15
|
-
`act` is the same as [react-dom/test-utils act
|
15
|
+
`act` is the same as [react-dom/test-utils act function](https://reactjs.org/docs/testing-recipes.html#act).
|
16
16
|
|
17
17
|
## Example
|
18
18
|
|
@@ -112,8 +112,8 @@
|
|
112
112
|
"description": "The label for category 常见问题 in sidebar guidesSidebar"
|
113
113
|
},
|
114
114
|
"sidebar.apisAppSidebar.category.文件约定": {
|
115
|
-
"message": "
|
116
|
-
"description": "The label for category
|
115
|
+
"message": "Convention",
|
116
|
+
"description": "The label for category convention in sidebar apisAppSidebar"
|
117
117
|
},
|
118
118
|
"sidebar.apisAppSidebar.category.src/": {
|
119
119
|
"message": "src/",
|
@@ -124,12 +124,12 @@
|
|
124
124
|
"description": "The label for category api/ in sidebar apisAppSidebar"
|
125
125
|
},
|
126
126
|
"sidebar.apisAppSidebar.category.函数写法": {
|
127
|
-
"message": "
|
128
|
-
"description": "The label for category
|
127
|
+
"message": "Function",
|
128
|
+
"description": "The label for category Function in sidebar apisAppSidebar"
|
129
129
|
},
|
130
130
|
"sidebar.apisAppSidebar.category.框架写法": {
|
131
|
-
"message": "
|
132
|
-
"description": "The label for category
|
131
|
+
"message": "Framework",
|
132
|
+
"description": "The label for category Framework in sidebar apisAppSidebar"
|
133
133
|
},
|
134
134
|
"sidebar.apisAppSidebar.category.server/": {
|
135
135
|
"message": "server/",
|
@@ -141,11 +141,11 @@
|
|
141
141
|
},
|
142
142
|
"sidebar.apisAppSidebar.category.命令": {
|
143
143
|
"message": "Commands",
|
144
|
-
"description": "The label for category
|
144
|
+
"description": "The label for category command in sidebar apisAppSidebar"
|
145
145
|
},
|
146
146
|
"sidebar.apisAppSidebar.category.运行时": {
|
147
147
|
"message": "Runtime",
|
148
|
-
"description": "The label for category
|
148
|
+
"description": "The label for category runtime in sidebar apisAppSidebar"
|
149
149
|
},
|
150
150
|
"sidebar.apisAppSidebar.category.核心 API": {
|
151
151
|
"message": "Core API",
|
@@ -188,8 +188,8 @@
|
|
188
188
|
"description": "The label for category 插件 API in sidebar apisAppSidebar"
|
189
189
|
},
|
190
190
|
"sidebar.apisMonorepoSidebar.category.文件约定": {
|
191
|
-
"message": "
|
192
|
-
"description": "The label for category
|
191
|
+
"message": "Convention",
|
192
|
+
"description": "The label for category convention in sidebar apisMonorepoSidebar"
|
193
193
|
},
|
194
194
|
"sidebar.apisMonorepoSidebar.category.命令": {
|
195
195
|
"message": "命令",
|
package/package.json
CHANGED
@@ -11,20 +11,20 @@
|
|
11
11
|
"modern",
|
12
12
|
"modern.js"
|
13
13
|
],
|
14
|
-
"version": "0.0.0-next-
|
14
|
+
"version": "0.0.0-next-20221124071519",
|
15
15
|
"publishConfig": {
|
16
16
|
"registry": "https://registry.npmjs.org/",
|
17
17
|
"access": "public"
|
18
18
|
},
|
19
19
|
"peerDependencies": {
|
20
|
-
"@modern-js/builder-doc": "0.0.0-next-
|
20
|
+
"@modern-js/builder-doc": "0.0.0-next-20221124071519"
|
21
21
|
},
|
22
22
|
"devDependencies": {
|
23
23
|
"ts-node": "^10",
|
24
24
|
"fs-extra": "^10",
|
25
25
|
"@types/node": "^16",
|
26
26
|
"@types/fs-extra": "^9",
|
27
|
-
"@modern-js/builder-doc": "0.0.0-next-
|
27
|
+
"@modern-js/builder-doc": "0.0.0-next-20221124071519"
|
28
28
|
},
|
29
29
|
"scripts": {
|
30
30
|
"build": "npx ts-node ./scripts/sync.ts"
|
@@ -13,7 +13,7 @@ Options:
|
|
13
13
|
-h, --help display help for command
|
14
14
|
```
|
15
15
|
|
16
|
-
运行 `ESLint`
|
16
|
+
运行 `ESLint` 检查代码语法情况。通常情况下,我们只需要在 `git commit` 阶段通过 `lint-staged` 检查本次提交修改的部分代码。
|
17
17
|
|
18
18
|
* `--no-fix` 参数设置后可以关闭自动修复 lint 错误代码的能力。
|
19
19
|
|