@modern-js/main-doc 2.25.2 → 2.27.0
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 +16 -0
- package/docs/en/components/prerequisites.mdx +1 -1
- package/docs/en/configure/app/experiments/source-build.mdx +13 -0
- package/docs/en/configure/app/server/ssr.mdx +6 -5
- package/docs/en/configure/app/source/alias-strategy.mdx +13 -0
- package/docs/en/configure/app/tools/swc.mdx +3 -1
- package/docs/en/guides/advanced-features/rspack-start.mdx +1 -1
- package/docs/en/guides/get-started/quick-start.mdx +23 -3
- package/docs/en/guides/topic-detail/framework-plugin/hook-list.mdx +222 -144
- package/docs/en/guides/topic-detail/generator/plugin/api/onForged.md +1 -1
- package/docs/en/tutorials/first-app/c03-css.mdx +3 -2
- package/docs/zh/components/prerequisites.mdx +1 -1
- package/docs/zh/configure/app/deploy/microFrontend.mdx +1 -1
- package/docs/zh/configure/app/experiments/source-build.mdx +13 -0
- package/docs/zh/configure/app/server/ssr.mdx +6 -5
- package/docs/zh/configure/app/source/alias-strategy.mdx +13 -0
- package/docs/zh/configure/app/tools/swc.mdx +3 -1
- package/docs/zh/guides/advanced-features/rspack-start.mdx +1 -1
- package/docs/zh/guides/advanced-features/using-storybook.mdx +1 -1
- package/docs/zh/guides/get-started/quick-start.mdx +28 -7
- package/docs/zh/guides/topic-detail/framework-plugin/hook-list.mdx +179 -101
- package/package.json +5 -5
package/CHANGELOG.md
CHANGED
@@ -1,5 +1,21 @@
|
|
1
1
|
# @modern-js/main-doc
|
2
2
|
|
3
|
+
## 2.27.0
|
4
|
+
|
5
|
+
### Patch Changes
|
6
|
+
|
7
|
+
- 86274f5: docs: add source code build documentation
|
8
|
+
docs: 添加源码构建文档
|
9
|
+
- ebdc4da: Fixed markdown error for link to styled-components website
|
10
|
+
- Updated dependencies [86274f5]
|
11
|
+
- @modern-js/builder-doc@2.27.0
|
12
|
+
|
13
|
+
## 2.26.0
|
14
|
+
|
15
|
+
### Patch Changes
|
16
|
+
|
17
|
+
- @modern-js/builder-doc@2.26.0
|
18
|
+
|
3
19
|
## 2.25.2
|
4
20
|
|
5
21
|
### Patch Changes
|
@@ -0,0 +1,13 @@
|
|
1
|
+
---
|
2
|
+
sidebar_label: sourceBuild
|
3
|
+
---
|
4
|
+
|
5
|
+
# experiments.sourceBuild
|
6
|
+
|
7
|
+
:::tip
|
8
|
+
This config is provided by Modern.js Builder, more detail can see [experiments.sourceBuild](https://modernjs.dev/builder/en/api/config-experiments.html#experimentssourcebuild).
|
9
|
+
:::
|
10
|
+
|
11
|
+
import Main from '@modern-js/builder-doc/docs/en/config/experiments/sourceBuild.md';
|
12
|
+
|
13
|
+
<Main />
|
@@ -32,14 +32,15 @@ When the value type is `Object`, the following properties can be configured:
|
|
32
32
|
```ts title="modern.config.ts"
|
33
33
|
export default defineConfig({
|
34
34
|
server: {
|
35
|
-
|
36
|
-
|
37
|
-
|
35
|
+
ssr: {
|
36
|
+
forceCSR: true,
|
37
|
+
mode: 'stream',
|
38
|
+
inlineScript: false,
|
39
|
+
},
|
38
40
|
},
|
39
41
|
});
|
40
42
|
```
|
41
43
|
|
42
|
-
|
43
44
|
### Active Fallback
|
44
45
|
|
45
46
|
In a production environment, there are scenarios where it is necessary to actively fallback an SSR project to CSR. Examples include
|
@@ -50,7 +51,7 @@ In a production environment, there are scenarios where it is necessary to active
|
|
50
51
|
|
51
52
|
3. When the SSR server is under heavy load, it may be necessary to fallback some traffic directly to the CSR to avoid service downtime.
|
52
53
|
|
53
|
-
By configuring `ssr.
|
54
|
+
By configuring `server.ssr.forceCSR` to `true` in the project, you can control this behavior through query strings or request headers.
|
54
55
|
|
55
56
|
For example, in a custom Web Server middleware, you can actively fallback when traffic exceeds a certain threshold:
|
56
57
|
|
@@ -0,0 +1,13 @@
|
|
1
|
+
---
|
2
|
+
sidebar_label: aliasStrategy
|
3
|
+
---
|
4
|
+
|
5
|
+
# source.aliasStrategy
|
6
|
+
|
7
|
+
:::tip
|
8
|
+
This config is provided by Modern.js Builder, more detail can see [source.aliasStrategy](https://modernjs.dev/builder/en/api/config-source.html#sourcealiasstrategy).
|
9
|
+
:::
|
10
|
+
|
11
|
+
import Main from '@modern-js/builder-doc/docs/en/config/source/aliasStrategy.md';
|
12
|
+
|
13
|
+
<Main />
|
@@ -15,11 +15,13 @@ import SWC from '@modern-js/builder-doc/docs/en/shared/swc.md';
|
|
15
15
|
|
16
16
|
:::tip
|
17
17
|
When using Rspack as the bundler, SWC will be used for transpiling and compression by default, so you don't need to install or configure the SWC plugin.
|
18
|
+
|
19
|
+
If you have configured the current SWC plugin when using Rspack, it will not have any effect.
|
18
20
|
:::
|
19
21
|
|
20
22
|
## Install
|
21
23
|
|
22
|
-
import EnableSWC from '@modern-js/builder-doc/docs/en/shared/
|
24
|
+
import EnableSWC from '@modern-js/builder-doc/docs/en/shared/enableSwc.md';
|
23
25
|
|
24
26
|
<EnableSWC />
|
25
27
|
|
@@ -13,7 +13,7 @@ import Prerequisites from "@site-docs-en/components/prerequisites"
|
|
13
13
|
|
14
14
|
## Installation
|
15
15
|
|
16
|
-
Modern.js provides the `@modern-js/create` tool to create projects.
|
16
|
+
Modern.js provides the `@modern-js/create` tool to create projects. It does not require global installation and can be run on-demand using `npx`.
|
17
17
|
|
18
18
|
You can create a project in an existing empty directory:
|
19
19
|
|
@@ -47,21 +47,41 @@ In a Modern.js project created using `@modern-js/create`, a `modern.config.ts` f
|
|
47
47
|
You can modify the configuration through this file to override the default behavior of Modern.js. For example, to enable SSR, add the following configuration:
|
48
48
|
|
49
49
|
```ts
|
50
|
-
import { defineConfig } from '@modern-js/app-tools';
|
50
|
+
import { appTools, defineConfig } from '@modern-js/app-tools';
|
51
51
|
|
52
52
|
export default defineConfig({
|
53
53
|
runtime: {
|
54
54
|
router: true,
|
55
|
-
state: true,
|
56
55
|
},
|
57
56
|
server: {
|
58
57
|
ssr: true,
|
59
58
|
},
|
59
|
+
plugins: [appTools()],
|
60
60
|
});
|
61
61
|
```
|
62
62
|
|
63
63
|
After running `pnpm run dev` again, you can find that the project has completed page rendering on the server in the browser's Network menu.
|
64
64
|
|
65
|
+
## Core npm Package
|
66
|
+
|
67
|
+
In a newly created project, the `@modern-js/app-tools` npm package is installed by default. It is the core package of the Modern.js framework and provides the following capabilities:
|
68
|
+
|
69
|
+
- It offers commonly used CLI commands such as `modern dev`, `modern build`, and more.
|
70
|
+
- It integrates Modern.js Core, providing capabilities for configuration parsing, plugin loading, and more.
|
71
|
+
- It integrates Modern.js Builder, providing build capabilities.
|
72
|
+
- It integrates Modern.js Server, providing capabilities for development and production servers.
|
73
|
+
- It integrates some commonly used plugins, such as `plugin-lint`, `plugin-data-loader`, and more.
|
74
|
+
|
75
|
+
`@modern-js/app-tools` is implemented based on the plugin system of Modern.js. Essentially, it is a plugin. Therefore, you need to register `appTools` in the `plugins` field of the configuration file:
|
76
|
+
|
77
|
+
```ts title="modern.config.ts"
|
78
|
+
import { appTools, defineConfig } from '@modern-js/app-tools';
|
79
|
+
|
80
|
+
export default defineConfig({
|
81
|
+
plugins: [appTools()],
|
82
|
+
});
|
83
|
+
```
|
84
|
+
|
65
85
|
## Build the project
|
66
86
|
|
67
87
|
To build the production artifacts of the project, run `pnpm run build` in the project:
|