@modern-js/main-doc 2.60.6 → 2.62.0
Sign up to get free protection for your applications and to get access to all the features.
- package/docs/en/apis/app/runtime/core/use-runtime-context.mdx +86 -33
- package/docs/en/components/init-app.mdx +0 -1
- package/docs/en/components/init-rspack-app.mdx +0 -1
- package/docs/en/guides/advanced-features/source-build.mdx +11 -4
- package/docs/en/guides/basic-features/deploy.mdx +104 -2
- package/docs/en/guides/basic-features/render/ssr.mdx +23 -1
- package/docs/en/guides/concept/entries.mdx +58 -5
- package/docs/en/guides/get-started/introduction.mdx +1 -38
- package/docs/en/guides/get-started/tech-stack.mdx +1 -1
- package/docs/zh/apis/app/runtime/core/use-runtime-context.mdx +86 -33
- package/docs/zh/components/default-mwa-generate.mdx +0 -1
- package/docs/zh/components/init-app.mdx +0 -1
- package/docs/zh/components/init-rspack-app.mdx +0 -1
- package/docs/zh/guides/advanced-features/source-build.mdx +11 -4
- package/docs/zh/guides/basic-features/deploy.mdx +103 -5
- package/docs/zh/guides/basic-features/render/ssr.mdx +23 -1
- package/docs/zh/guides/concept/entries.mdx +52 -4
- package/docs/zh/guides/get-started/introduction.mdx +1 -36
- package/docs/zh/guides/get-started/tech-stack.mdx +1 -1
- package/package.json +4 -4
- package/src/i18n/enUS.ts +0 -7
- package/src/i18n/zhCN.ts +0 -7
- package/src/pages/index.tsx +3 -32
- package/docs/en/guides/topic-detail/generator/_meta.json +0 -17
- package/docs/en/guides/topic-detail/generator/create/_meta.json +0 -1
- package/docs/en/guides/topic-detail/generator/create/config.mdx +0 -59
- package/docs/en/guides/topic-detail/generator/create/option.md +0 -146
- package/docs/en/guides/topic-detail/generator/create/use.mdx +0 -48
- package/docs/en/guides/topic-detail/generator/new/_meta.json +0 -1
- package/docs/en/guides/topic-detail/generator/new/config.md +0 -115
- package/docs/en/guides/topic-detail/generator/new/option.md +0 -67
- package/docs/en/guides/topic-detail/generator/new/use.md +0 -75
- package/docs/en/guides/topic-detail/generator/plugin/_meta.json +0 -11
- package/docs/en/guides/topic-detail/generator/plugin/api/afterForged.md +0 -49
- package/docs/en/guides/topic-detail/generator/plugin/api/context.md +0 -184
- package/docs/en/guides/topic-detail/generator/plugin/api/input.md +0 -124
- package/docs/en/guides/topic-detail/generator/plugin/api/onForged.md +0 -310
- package/docs/en/guides/topic-detail/generator/plugin/category.md +0 -88
- package/docs/en/guides/topic-detail/generator/plugin/context.md +0 -104
- package/docs/en/guides/topic-detail/generator/plugin/structure.md +0 -106
- package/docs/en/guides/topic-detail/generator/plugin/use.md +0 -33
- package/docs/zh/guides/topic-detail/generator/_meta.json +0 -17
- package/docs/zh/guides/topic-detail/generator/create/_meta.json +0 -1
- package/docs/zh/guides/topic-detail/generator/create/config.mdx +0 -60
- package/docs/zh/guides/topic-detail/generator/create/option.md +0 -146
- package/docs/zh/guides/topic-detail/generator/create/use.mdx +0 -48
- package/docs/zh/guides/topic-detail/generator/new/_meta.json +0 -1
- package/docs/zh/guides/topic-detail/generator/new/config.md +0 -116
- package/docs/zh/guides/topic-detail/generator/new/option.md +0 -67
- package/docs/zh/guides/topic-detail/generator/new/use.md +0 -74
- package/docs/zh/guides/topic-detail/generator/plugin/_meta.json +0 -11
- package/docs/zh/guides/topic-detail/generator/plugin/api/afterForged.md +0 -50
- package/docs/zh/guides/topic-detail/generator/plugin/api/context.md +0 -184
- package/docs/zh/guides/topic-detail/generator/plugin/api/input.md +0 -124
- package/docs/zh/guides/topic-detail/generator/plugin/api/onForged.md +0 -310
- package/docs/zh/guides/topic-detail/generator/plugin/category.md +0 -93
- package/docs/zh/guides/topic-detail/generator/plugin/context.md +0 -105
- package/docs/zh/guides/topic-detail/generator/plugin/structure.md +0 -106
- package/docs/zh/guides/topic-detail/generator/plugin/use.md +0 -33
@@ -1,146 +0,0 @@
|
|
1
|
-
---
|
2
|
-
sidebar_position: 2
|
3
|
-
---
|
4
|
-
|
5
|
-
# CLI Options
|
6
|
-
|
7
|
-
`@modern-js/create` provides many configuration parameters to configure its behavior during execution, which can be viewed using the `--help` parameter:
|
8
|
-
|
9
|
-
```bash
|
10
|
-
npx @modern-js/create@latest --help
|
11
|
-
|
12
|
-
Usage: npx @modern-js/create@latest [projectDir]
|
13
|
-
|
14
|
-
create Modern.js solution project
|
15
|
-
|
16
|
-
Options:
|
17
|
-
--version show create tools version
|
18
|
-
--lang <lang> set create tools language(en or zh)
|
19
|
-
-c, --config <config> set default project config(json string) (default: "{}")
|
20
|
-
-d,--debug using debug mode to log something (default: false)
|
21
|
-
--mwa create mwa application using default config (default: false)
|
22
|
-
--module create module application using default config (default: false)
|
23
|
-
--generator <generator> run custom generator
|
24
|
-
-p, --plugin <plugin> use generator plugin to create new solution or customize Modern.js solution (default: [])
|
25
|
-
--dist-tag <distTag> use specified tag version for it\'s generator (default: "")
|
26
|
-
--packages <packages> set project specific dependency version information (default: "{}")
|
27
|
-
--registry <registry> set npm registry url to run npm command (default: "")
|
28
|
-
--no-need-install not run install command
|
29
|
-
-h, --help display help for command
|
30
|
-
|
31
|
-
Commands:
|
32
|
-
clean-cache clean locale generator cache
|
33
|
-
```
|
34
|
-
|
35
|
-
The following will provide a detailed introduction to these parameters:
|
36
|
-
|
37
|
-
## [projectDir]
|
38
|
-
|
39
|
-
The project directory name.
|
40
|
-
|
41
|
-
When executing `@modern-js/create`, a `projectDir` folder will be created in the current directory by default, and the project will be initialized in this folder. If this parameter is empty, the initialization project will be directly generated in the current directory.
|
42
|
-
|
43
|
-
:::info
|
44
|
-
If the contents of the directory where `projectDir` is located are not empty, a prompt will be given whether to continue creating. It is recommended to perform project initialization operations in an empty directory.
|
45
|
-
:::
|
46
|
-
|
47
|
-
## --version
|
48
|
-
|
49
|
-
Get the version of the `@modern-js/create` tool.
|
50
|
-
|
51
|
-
```bash
|
52
|
-
npx @modern-js/create@latest --version
|
53
|
-
|
54
|
-
[INFO] @modern-js/create v2.21.1
|
55
|
-
```
|
56
|
-
|
57
|
-
## --lang \<lang>
|
58
|
-
|
59
|
-
The execution language, supports `zh` and `en`.
|
60
|
-
|
61
|
-
By default, `@modern-js/create` will automatically identify the user's system language and choose to use Chinese or English. If the identification fails or does not meet usage habits, you can manually specify it using this parameter.
|
62
|
-
|
63
|
-
## -c, --config \<config>
|
64
|
-
|
65
|
-
Specify the default project configuration.
|
66
|
-
|
67
|
-
By default, `@modern-js/create` will prompt for interactive questions such as language selection and package managers during the execution process. When it is necessary to specify these configuration contents in advance, they can be passed in through this field.
|
68
|
-
|
69
|
-
This field is a JSON string. For example, when specifying a package manager:
|
70
|
-
|
71
|
-
```bash
|
72
|
-
npx @modern-js/create@latest --config '{"packageManager": "pnpm"}'
|
73
|
-
```
|
74
|
-
|
75
|
-
Supported parameters for `config` can be found at [Configuration Parameters](/guides/topic-detail/generator/create/config.html)。
|
76
|
-
|
77
|
-
## -d,--debug
|
78
|
-
|
79
|
-
Display debug logs.
|
80
|
-
|
81
|
-
When encountering problems during use, you can use this parameter to display debug logs, which is convenient for quickly locating the problem position and troubleshooting.
|
82
|
-
|
83
|
-
## --mwa
|
84
|
-
|
85
|
-
Quickly create a Web App project.
|
86
|
-
|
87
|
-
## --module
|
88
|
-
|
89
|
-
Quickly create a Npm Module project.
|
90
|
-
|
91
|
-
## -p, --plugin \<plugin>
|
92
|
-
|
93
|
-
Specify a generator plugin.
|
94
|
-
|
95
|
-
`@modern-js/create` supports customizing the default project solution type of Modern.js or adding project solution type scenarios using generator plugin. For details, please refer to [Developing Generator Plugin](/guides/topic-detail/generator/plugin/structure.html).
|
96
|
-
|
97
|
-
## --generator \<generator>
|
98
|
-
|
99
|
-
Specify a micro-generator.
|
100
|
-
|
101
|
-
<!-- TODO 详情可查看[开发微生成器]-->
|
102
|
-
`@modern-js/create` supports completely customizing the project generation process using micro-generator.
|
103
|
-
|
104
|
-
## --dist-tag \<distTag>
|
105
|
-
|
106
|
-
Specify the version of the generator and Modern.js-related dependencies.
|
107
|
-
|
108
|
-
During the execution of `@modern-js/create`, a smaller micro-generator will be executed by default, and the `latest` version of the micro-generator will be used by default. This parameter can be used to specify the version number of the micro-generator to be executed and the version of the installed Modern.js-related dependencies.
|
109
|
-
|
110
|
-
For example, use the `next` version:
|
111
|
-
|
112
|
-
```bash
|
113
|
-
npx @modern-js/create@next --dist-tag next
|
114
|
-
```
|
115
|
-
|
116
|
-
## --packages \<packages>
|
117
|
-
|
118
|
-
Specify specific package version dependencies when creating a project.
|
119
|
-
|
120
|
-
If you need to specify a specific package version when creating a project, you can use this parameter. This parameter will configure `pnpm.overrides` (if the package manager is pnpm) or `resolutions` to lock the package version number in the `package.json` file in the project root directory.
|
121
|
-
|
122
|
-
The parameter value is a JSON string.
|
123
|
-
|
124
|
-
For example, specify the react version:
|
125
|
-
|
126
|
-
```bash
|
127
|
-
npx @modern-js/create@latest --packages '{"react":"^17"}'
|
128
|
-
```
|
129
|
-
|
130
|
-
## --registry \<registry>
|
131
|
-
|
132
|
-
Specify the sub-generator to execute and the npm registry to fetch project dependencies version.
|
133
|
-
|
134
|
-
## --no-need-install
|
135
|
-
|
136
|
-
Ignore automatic installation of dependencies.
|
137
|
-
|
138
|
-
By default, `@modern-js/create` will automatically install dependencies after creating a project. Using this parameter can ignore the installation of dependencies.
|
139
|
-
|
140
|
-
## clean-cache
|
141
|
-
|
142
|
-
The `@modern-js/create` command generates sub-generators cache in the tmp directory of the execution machine by default to speed up the generator execution. This command can be used to delete the cache when it needs to be refreshed or when there are problems with the cache.
|
143
|
-
|
144
|
-
```bash
|
145
|
-
npx @modern-js/create@latest clean-cache
|
146
|
-
```
|
@@ -1,48 +0,0 @@
|
|
1
|
-
---
|
2
|
-
sidebar_position: 1
|
3
|
-
---
|
4
|
-
|
5
|
-
# Usage
|
6
|
-
|
7
|
-
Modern.js provides `@modern-js/create` tool for creating project templates provided by Modern.js, including [Web App](https://modernjs.dev/), [Npm Module](https://modernjs.dev/module-tools).
|
8
|
-
|
9
|
-
The following will introduce how to use `@modern-js/create`.
|
10
|
-
|
11
|
-
## Environment Preparation
|
12
|
-
|
13
|
-
import Prerequisites from "@site-docs-en/components/prerequisites"
|
14
|
-
|
15
|
-
<Prerequisites />
|
16
|
-
|
17
|
-
## Create a Project with `@modern-js/create`
|
18
|
-
|
19
|
-
You do not need to install `@modern-js/create` globally, just use npx to run it:
|
20
|
-
|
21
|
-
```bash
|
22
|
-
npx @modern-js/create@latest [projectDir]
|
23
|
-
```
|
24
|
-
|
25
|
-
:::info
|
26
|
-
`[projectDir]` is the project directory name. If it is not filled in, the project will be created in the current directory.
|
27
|
-
:::
|
28
|
-
|
29
|
-
During the execution, complete the interaction according to the prompt to create a project that meets your requirements.
|
30
|
-
|
31
|
-
### Create an Web APP Project
|
32
|
-
|
33
|
-
```bash
|
34
|
-
npx @modern-js/create@latest web-app
|
35
|
-
? Please select the type of project you want to create: Web App
|
36
|
-
? Please select the programming language: TS
|
37
|
-
? Please select the package manager: pnpm
|
38
|
-
```
|
39
|
-
|
40
|
-
### Create an Npm Module Project
|
41
|
-
|
42
|
-
```bash
|
43
|
-
npx @modern-js/create@latest npm-module
|
44
|
-
? Please select the type of project you want to create: Npm Module
|
45
|
-
? Please fill in the project name: npm-module
|
46
|
-
? Please select the programming language: TS
|
47
|
-
? Please select the package manager: pnpm
|
48
|
-
```
|
@@ -1 +0,0 @@
|
|
1
|
-
["use", "option", "config"]
|
@@ -1,115 +0,0 @@
|
|
1
|
-
---
|
2
|
-
sidebar_position: 3
|
3
|
-
---
|
4
|
-
|
5
|
-
# Configuration Parameters
|
6
|
-
|
7
|
-
The `new` command provides the [--config](/guides/topic-detail/generator/new/option.html#-c,---config-<config>) parameter, which is used to specify the answers to interactive questions in advance during the execution process.
|
8
|
-
|
9
|
-
Here, we will introduce the fields and field values that can be configured in the `config` under different scenario.
|
10
|
-
|
11
|
-
## General Configuration
|
12
|
-
|
13
|
-
### actionType
|
14
|
-
|
15
|
-
Question: Please select the operation you wants.
|
16
|
-
|
17
|
-
Options:
|
18
|
-
|
19
|
-
- Create project element -- element
|
20
|
-
|
21
|
-
- Enable features -- function
|
22
|
-
|
23
|
-
- Automatic refactors -- refactor
|
24
|
-
|
25
|
-
## Web App
|
26
|
-
|
27
|
-
### element
|
28
|
-
|
29
|
-
Question: Please select the type of element to create.
|
30
|
-
|
31
|
-
Options:
|
32
|
-
|
33
|
-
- New "entry" -- entry
|
34
|
-
|
35
|
-
- New "Custom Web Server" source code directory -- server
|
36
|
-
|
37
|
-
### name
|
38
|
-
|
39
|
-
Question: Please fill in the entry name.
|
40
|
-
|
41
|
-
:::info
|
42
|
-
This configuration is required when creating a new application entry, and the configuration value is a string.
|
43
|
-
:::
|
44
|
-
|
45
|
-
### function
|
46
|
-
|
47
|
-
Question: Please select the feature name.
|
48
|
-
|
49
|
-
Options:
|
50
|
-
|
51
|
-
- Enable Rspack Build -- rspack
|
52
|
-
|
53
|
-
- Enable Tailwind CSS -- tailwindcss
|
54
|
-
|
55
|
-
- Enable BFF -- bff
|
56
|
-
|
57
|
-
- Enable SSG -- ssg
|
58
|
-
|
59
|
-
- Enable SWC Compile -- swc
|
60
|
-
|
61
|
-
- Enable Micro Frontend -- micro_frontend
|
62
|
-
|
63
|
-
- Enable UA-based Polyfill Feature -- polyfill
|
64
|
-
|
65
|
-
- Enable Global Proxy -- proxy
|
66
|
-
|
67
|
-
### bffType
|
68
|
-
|
69
|
-
Question: Please select the BFF type
|
70
|
-
|
71
|
-
Options:
|
72
|
-
|
73
|
-
- Function -- func
|
74
|
-
|
75
|
-
- Framework -- framework
|
76
|
-
|
77
|
-
:::info
|
78
|
-
This configuration is required when enabling the BFF function.
|
79
|
-
:::
|
80
|
-
|
81
|
-
### framework
|
82
|
-
|
83
|
-
Question: Please select the framework.
|
84
|
-
|
85
|
-
Options:
|
86
|
-
|
87
|
-
- Express -- express
|
88
|
-
|
89
|
-
- Koa -- koa
|
90
|
-
|
91
|
-
:::info
|
92
|
-
This configuration is required when enabling the BFF function.
|
93
|
-
:::
|
94
|
-
|
95
|
-
### refactor
|
96
|
-
|
97
|
-
Question: Please select the type of refactoring.
|
98
|
-
|
99
|
-
Options:
|
100
|
-
|
101
|
-
- Use React Router v5 -- react_router_5
|
102
|
-
|
103
|
-
## Npm Module
|
104
|
-
|
105
|
-
### function
|
106
|
-
|
107
|
-
Question: Please select the feature name.
|
108
|
-
|
109
|
-
Options:
|
110
|
-
|
111
|
-
- Enable Tailwind CSS -- tailwindcss
|
112
|
-
|
113
|
-
- Enable Storybook -- storybook
|
114
|
-
|
115
|
-
- Enable Runtime API -- runtime_api
|
@@ -1,67 +0,0 @@
|
|
1
|
-
---
|
2
|
-
sidebar_position: 2
|
3
|
-
---
|
4
|
-
|
5
|
-
# CLI Parameters
|
6
|
-
|
7
|
-
The `new` command provides many configuration parameters to configure its behavior during execution, which can be viewed using the `--help` parameter:
|
8
|
-
|
9
|
-
```bash
|
10
|
-
npm run new --help
|
11
|
-
|
12
|
-
Usage: modern new [options]
|
13
|
-
|
14
|
-
enable optional features or add a new entry
|
15
|
-
|
16
|
-
Options:
|
17
|
-
--lang <lang> set new command language(en or zh)
|
18
|
-
-c, --config <config> set default generator config(json string)
|
19
|
-
-d, --debug using debug mode to log something (default: false)
|
20
|
-
--dist-tag <tag> use specified tag version for it's generator
|
21
|
-
--registry <registry> set npm registry url to run npm command
|
22
|
-
-h, --help display help for command
|
23
|
-
```
|
24
|
-
|
25
|
-
The following will provide a detailed introduction to these parameters:
|
26
|
-
|
27
|
-
## --lang \<lang>
|
28
|
-
|
29
|
-
The language used for execution, supports `zh` and `en`.
|
30
|
-
|
31
|
-
By default, the `new` command will automatically recognize the user's system language and choose to use Chinese or English. If recognition fails or does not meet usage habits, this parameter can be used to manually specify it.
|
32
|
-
|
33
|
-
## -c, --config \<config>
|
34
|
-
|
35
|
-
Specify the default configuration for the project.
|
36
|
-
|
37
|
-
By default, the `new` command will prompt interactive questions during the execution process for selecting operation types, enabling features, etc. When it is necessary to specify these configuration contents in advance, they can be passed in through this field.
|
38
|
-
|
39
|
-
This field is a JSON string. For example, to specify the BFF framework:
|
40
|
-
|
41
|
-
```bash
|
42
|
-
npm run new --config '{"framework": "express"}'
|
43
|
-
```
|
44
|
-
|
45
|
-
The parameters supported by `config` can be viewed in [Configuration Parameters](/guides/topic-detail/generator/new/config.html)。
|
46
|
-
|
47
|
-
## -d,--debug
|
48
|
-
|
49
|
-
Displays debug logs.
|
50
|
-
|
51
|
-
When encountering problems during use, this parameter can be used to display debug logs, which is convenient for quickly locating the problem location and troubleshooting the problem.
|
52
|
-
|
53
|
-
## --registry \<registry>
|
54
|
-
|
55
|
-
Specify the sub-generator to execute and the npm registry to fetch project dependencies version.
|
56
|
-
|
57
|
-
## --dist-tag \<distTag>
|
58
|
-
|
59
|
-
Specify the generator version.
|
60
|
-
|
61
|
-
During the execution process of the `new` command, smaller micro-generator will be executed by default, and the latest micro-generator version will be used by default. This parameter can be used to specify the version number of the micro-generator to be executed.
|
62
|
-
|
63
|
-
For example, using the `next` version:
|
64
|
-
|
65
|
-
```bash
|
66
|
-
npm run new --dist-tag next
|
67
|
-
```
|
@@ -1,75 +0,0 @@
|
|
1
|
-
---
|
2
|
-
sidebar_position: 1
|
3
|
-
---
|
4
|
-
|
5
|
-
# Usage
|
6
|
-
|
7
|
-
In Web App, Npm Module projects, we provide the `new` command to create project elements, enable features and create sub-project.
|
8
|
-
|
9
|
-
## Web App
|
10
|
-
|
11
|
-
Web App projects use the `new` command provided by `@modern-js/app-tools`.
|
12
|
-
|
13
|
-
|
14
|
-
The `new` command provides three types of operations:
|
15
|
-
|
16
|
-
- Create project elements
|
17
|
-
|
18
|
-
- Enable optional features
|
19
|
-
|
20
|
-
- Automatic refactoring
|
21
|
-
|
22
|
-
Each type of operation provides a corresponding list of supported options, which can be selected based on the project situation.
|
23
|
-
|
24
|
-
For example:
|
25
|
-
|
26
|
-
Create a new application entry:
|
27
|
-
|
28
|
-
```bash
|
29
|
-
npm run new
|
30
|
-
? Please select the operation you want: Create Element
|
31
|
-
? Please select the type of element to create: New "entry"
|
32
|
-
? Please fill in the entry name: entry
|
33
|
-
```
|
34
|
-
|
35
|
-
After running, a new folder with the corresponding name of the entry will be created in the `src` directory of the project, along with the default entry file. The previous entry files under the `src` directory will be sorted into the folder corresponding to the `name` field in `package.json`.
|
36
|
-
|
37
|
-
Enable BFF function:
|
38
|
-
|
39
|
-
```bash
|
40
|
-
npm run new
|
41
|
-
? Please select the operation you want: Enable Features
|
42
|
-
? Please select the feature name: Enable BFF
|
43
|
-
? Please select the BFF type: Function
|
44
|
-
? Please select the framework: Express
|
45
|
-
```
|
46
|
-
|
47
|
-
After running, BFF-related dependencies will be installed in the project, and an `api` directory will be created for BFF module development, along with prompt information for registering BFF plugins.
|
48
|
-
|
49
|
-
:::info
|
50
|
-
We did not automatically register the plugin for the user here because the `modern.config.[tj]s` may change during the project lifecycle, and there may be problems with mutual references between modules, so allowing the user to manually register can ensure the correctness of modifying the configuration.
|
51
|
-
|
52
|
-
In subsequent customized development, if there are similar needs, you can also provide users with operational guidance through prompts, allowing users to manually operate on files.
|
53
|
-
:::
|
54
|
-
|
55
|
-
:::warning
|
56
|
-
When running the `new` command, it may be necessary to enable a feature that is not in the list. Check whether the corresponding plugin for the feature has been installed in the `package.json` file of the project. If you still need to use the `new` command to enable it, you need to manually remove the plugin dependency first.
|
57
|
-
:::
|
58
|
-
|
59
|
-
## Npm Module
|
60
|
-
|
61
|
-
Npm Module projects use the `new` command provided by `@modern-js/module-tools`.
|
62
|
-
|
63
|
-
The `new` command provides the ability to enable optional features.
|
64
|
-
|
65
|
-
For example:
|
66
|
-
|
67
|
-
Enable Storybook capability:
|
68
|
-
|
69
|
-
```bash
|
70
|
-
npm run new
|
71
|
-
? Please select the operation you want: Enable Features
|
72
|
-
? Please select the feature name: Enable Storybook
|
73
|
-
```
|
74
|
-
|
75
|
-
After running, Storybook plugin dependencies will be installed in the project, and the `storybook` command will be added. A `stories` directory will be created for Storybook module development, along with prompt information for registering Storybook plugins.
|
@@ -1,49 +0,0 @@
|
|
1
|
-
---
|
2
|
-
sidebar_position: 3
|
3
|
-
---
|
4
|
-
|
5
|
-
# afterForged
|
6
|
-
|
7
|
-
`afterForged` is a lifecycle function used for other step operations after file operations in generator plugin.
|
8
|
-
|
9
|
-
## Types
|
10
|
-
|
11
|
-
```ts
|
12
|
-
export type AfterForgedAPI = {
|
13
|
-
isInGitRepo: () => Promise<boolean>;
|
14
|
-
initGitRepo: () => Promise<void>;
|
15
|
-
gitAddAndCommit: (commitMessage: string) => Promise<void>;
|
16
|
-
install: () => Promise<void>;
|
17
|
-
};
|
18
|
-
|
19
|
-
export type PluginAfterForgedFunc = (api: AfterForgedAPI, inputData: Record<string, unknown>) => Promise<void>;
|
20
|
-
|
21
|
-
export interface IPluginContext {
|
22
|
-
afterForged: (func: PluginAfterForgedFunc) => void;
|
23
|
-
...
|
24
|
-
}
|
25
|
-
```
|
26
|
-
|
27
|
-
## API
|
28
|
-
|
29
|
-
The APIs provided by the `api` parameter will be introduced below.
|
30
|
-
|
31
|
-
### isInGitRepo
|
32
|
-
|
33
|
-
Checks whether the current project is a git repository.
|
34
|
-
|
35
|
-
### initGitRepo
|
36
|
-
|
37
|
-
Initializes the current project as a git repository.
|
38
|
-
|
39
|
-
### gitAddAndCommit
|
40
|
-
|
41
|
-
Commits changes to the current repository.
|
42
|
-
|
43
|
-
Parameters:
|
44
|
-
|
45
|
-
- `commitMessage`: commit message.
|
46
|
-
|
47
|
-
### install
|
48
|
-
|
49
|
-
Installs dependencies in the root directory of the project. The `install` function will use the corresponding package manager according to the value of `packageManager` to install dependencies.
|
@@ -1,184 +0,0 @@
|
|
1
|
-
---
|
2
|
-
sidebar_position: 1
|
3
|
-
---
|
4
|
-
|
5
|
-
# context
|
6
|
-
|
7
|
-
The generator plugin exports a function by default in the `main` file, and the function parameter is `context`. All APIs provided by the generator plugin are provided by this `context`.
|
8
|
-
|
9
|
-
## Types
|
10
|
-
|
11
|
-
Let's first understand the type definition of `context`:
|
12
|
-
|
13
|
-
```ts
|
14
|
-
export interface IPluginContext {
|
15
|
-
locale?: string;
|
16
|
-
addInputBefore: (key: string, input: Schema) => void;
|
17
|
-
addInputAfter: (key: string, input: Schema) => void;
|
18
|
-
setInput: (key: string, field: string, value: unknown) => void;
|
19
|
-
setInputValue: (value: Record<string, unknown>) => void;
|
20
|
-
setDefaultConfig: (value: Record<string, unknown>) => void;
|
21
|
-
isFileExist: (fileName: string) => Promise<boolean>;
|
22
|
-
readDir: (dir: string) => Promise<string[]>;
|
23
|
-
setGitMessage: (gitMessage: string) => void;
|
24
|
-
onForged: (func: PluginForgedFunc) => void;
|
25
|
-
afterForged: (func: PluginAfterForgedFunc) => void;
|
26
|
-
}
|
27
|
-
```
|
28
|
-
|
29
|
-
The contents provided by `context` can be mainly divided into three categories:
|
30
|
-
|
31
|
-
- Get the information of the current generator execution environment.
|
32
|
-
|
33
|
-
- Operate input.
|
34
|
-
|
35
|
-
- Generator plugin lifecycle function.
|
36
|
-
|
37
|
-
|
38
|
-
The generator plugin APIs will be introduced from these three categories below.
|
39
|
-
|
40
|
-
### Get Information
|
41
|
-
|
42
|
-
#### locale
|
43
|
-
|
44
|
-
Gets the language of the generator plugin execution environment. `@modern-js/create` provides two languages, `zh` and `en`, which correspond to these two values.
|
45
|
-
|
46
|
-
#### isFileExist
|
47
|
-
|
48
|
-
Checks whether a file exists. We often need to confirm whether the target project file exists before defining the operation. This API can be used directly for this purpose.
|
49
|
-
|
50
|
-
For example, we need to find out if the `package.json` file exists and then do someing:
|
51
|
-
|
52
|
-
```ts
|
53
|
-
const isExist = await context.isFileExist('package.json');
|
54
|
-
if (isExist) {
|
55
|
-
...
|
56
|
-
}
|
57
|
-
```
|
58
|
-
|
59
|
-
#### readDir
|
60
|
-
|
61
|
-
Gets the file list in a folder. We often need to get the file list under the target project folder before defining the operation. This API can be used directly for this purpose.
|
62
|
-
|
63
|
-
For example, we need to get all files under the `src` folder and then do someing:
|
64
|
-
|
65
|
-
```ts
|
66
|
-
const files = await context.readDir('src');
|
67
|
-
|
68
|
-
files.map(name => {
|
69
|
-
...
|
70
|
-
});
|
71
|
-
```
|
72
|
-
|
73
|
-
### Input Operations
|
74
|
-
|
75
|
-
The `key` parameter used in input operations can refer to [Configuration Parameters](/guides/topic-detail/generator/create/config.html) and use the key under the solution’s scheme, that is, it does not support `solution` and `scenes`.
|
76
|
-
|
77
|
-
The input parameter in input operations corresponds to the schema type described in [Input](/guides/topic-detail/generator/plugin/api/input.html).
|
78
|
-
|
79
|
-
#### addInputBefore
|
80
|
-
|
81
|
-
Adds a question before the specified input `key`.
|
82
|
-
|
83
|
-
For example:
|
84
|
-
|
85
|
-
```ts
|
86
|
-
context.addInputBefore('packageManager', {
|
87
|
-
type: 'object',
|
88
|
-
properties: {
|
89
|
-
language: {
|
90
|
-
type: 'string',
|
91
|
-
title: 'Please select the programming language:',
|
92
|
-
enum: [
|
93
|
-
{ label: 'TS', value: 'ts' },
|
94
|
-
{ label: 'ES6+', value: 'js' },
|
95
|
-
],
|
96
|
-
},
|
97
|
-
},
|
98
|
-
});
|
99
|
-
```
|
100
|
-
|
101
|
-
#### addInputAfter
|
102
|
-
|
103
|
-
Adds a question after the specified input `key`.
|
104
|
-
|
105
|
-
For example:
|
106
|
-
|
107
|
-
```ts
|
108
|
-
context.addInputAfter('packageManager', {
|
109
|
-
type: 'object',
|
110
|
-
properties: {
|
111
|
-
language: {
|
112
|
-
type: 'string',
|
113
|
-
title: 'Please select the programming language:',
|
114
|
-
enum: [
|
115
|
-
{ label: 'TS', value: 'ts' },
|
116
|
-
{ label: 'ES6+', value: 'js' },
|
117
|
-
],
|
118
|
-
},
|
119
|
-
},
|
120
|
-
});
|
121
|
-
```
|
122
|
-
|
123
|
-
:::info
|
124
|
-
1. The `key` for adding a question cannot be the same as the `key` of the question provided by Modern.js solution scheme itself.
|
125
|
-
2. The priority of adding a question with `addInputAfter` is higher than that of `addInputBefore`. When adding an After question to a key and adding a Before question to the next key, the After question will be before the Before question.
|
126
|
-
3. When adding multiple questions before or after the same `key`, this method can be called multiple times, and the order of the questions will be arranged according to the calling sequence.
|
127
|
-
|
128
|
-
:::
|
129
|
-
|
130
|
-
#### setInput
|
131
|
-
|
132
|
-
Sets the attributes of the specified input `key`.
|
133
|
-
|
134
|
-
For example, set the `title` attribute of `packageName`:
|
135
|
-
|
136
|
-
```ts
|
137
|
-
context.setInput('packageName', 'title', "Name");
|
138
|
-
```
|
139
|
-
|
140
|
-
:::info
|
141
|
-
For input options provided by Modern.js solution schemes, only deletion is supported, and adding will cause logical judgment problems in the code.
|
142
|
-
:::
|
143
|
-
|
144
|
-
|
145
|
-
#### setInputValue
|
146
|
-
|
147
|
-
Sets the default value of the specified input `key`.
|
148
|
-
|
149
|
-
For example, set the default value of `packageManager`:
|
150
|
-
|
151
|
-
```ts
|
152
|
-
context.setInputValue({
|
153
|
-
packageManager: 'npm',
|
154
|
-
});
|
155
|
-
```
|
156
|
-
|
157
|
-
:::info
|
158
|
-
After setting, the question still needs to be interactive, but the default value configured by the generator plugin will be used.
|
159
|
-
:::
|
160
|
-
|
161
|
-
#### setDefaultConfig
|
162
|
-
|
163
|
-
Sets the default value of the specified input `key`.
|
164
|
-
|
165
|
-
For example, set the default value of `packageManager`:
|
166
|
-
|
167
|
-
```ts
|
168
|
-
context.setDefaultConfig({
|
169
|
-
packageManager: 'npm',
|
170
|
-
});
|
171
|
-
```
|
172
|
-
|
173
|
-
:::info
|
174
|
-
After setting, the corresponding question will no longer be displayed, which is consistent with the `--config` behavior specified by `@modern-js/create`. Does not support setting `vertical` and `projectOrg`.
|
175
|
-
:::
|
176
|
-
|
177
|
-
#### setGitMessage
|
178
|
-
|
179
|
-
Sets the initial git commit message. Modern.js defaults to the git initialization commit message as `feat: init`, which can be modified by this function.
|
180
|
-
|
181
|
-
|
182
|
-
### Lifecycle Functions
|
183
|
-
|
184
|
-
The lifecycle functions are relatively complex and will be introduced separately in the following two sections, [`onForged`](/guides/topic-detail/generator/plugin/api/onForged.html) and [`afterForged`](/guides/topic-detail/generator/plugin/api/afterForged.html).
|