Skip to content

Commit a43b688

Browse files
nosoloswyouknowriad
authored andcommitted
New package to auto-generate public API documentation (#13329)
1 parent 686cc76 commit a43b688

112 files changed

Lines changed: 8511 additions & 34 deletions

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

‎docs/manifest.json‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -635,6 +635,12 @@
635635
"markdown_source": "https://raw.githubusercontent.com/WordPress/gutenberg/master/packages/deprecated/README.md",
636636
"parent": "packages"
637637
},
638+
{
639+
"title": "@wordpress/docgen",
640+
"slug": "packages-docgen",
641+
"markdown_source": "https://raw.githubusercontent.com/WordPress/gutenberg/master/packages/docgen/README.md",
642+
"parent": "packages"
643+
},
638644
{
639645
"title": "@wordpress/dom-ready",
640646
"slug": "packages-dom-ready",

‎package-lock.json‎

Lines changed: 26 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -66,6 +66,7 @@
6666
"@wordpress/babel-preset-default": "file:packages/babel-preset-default",
6767
"@wordpress/browserslist-config": "file:packages/browserslist-config",
6868
"@wordpress/custom-templated-path-webpack-plugin": "file:packages/custom-templated-path-webpack-plugin",
69+
"@wordpress/docgen": "file:packages/docgen",
6970
"@wordpress/e2e-test-utils": "file:packages/e2e-test-utils",
7071
"@wordpress/e2e-tests": "file:packages/e2e-tests",
7172
"@wordpress/eslint-plugin": "file:packages/eslint-plugin",
@@ -161,6 +162,7 @@
161162
"dev": "npm run build:packages && concurrently \"wp-scripts start\" \"npm run dev:packages\"",
162163
"dev:packages": "node ./bin/packages/watch.js",
163164
"docs:build": "node docs/tool",
165+
"docs:generate": "lerna run docs:generate",
164166
"fixtures:clean": "rimraf \"packages/e2e-tests/fixtures/blocks/*.+(json|serialized.html)\"",
165167
"fixtures:server-registered": "docker-compose run -w /var/www/html/wp-content/plugins/gutenberg --rm wordpress ./bin/get-server-blocks.php > test/integration/full-content/server-registered.json",
166168
"fixtures:generate": "npm run fixtures:server-registered && cross-env GENERATE_MISSING_FIXTURES=y npm run test-unit",

‎packages/docgen/.npmrc‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
package-lock=false

‎packages/docgen/CHANGELOG.md‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
## 1.0.0 (Unreleased)
2+
3+
- Initial release

‎packages/docgen/README.md‎

Lines changed: 250 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,250 @@
1+
# `docgen`
2+
3+
`docgen` helps you to generate the _public API_ of your code. Given an entry point file, it outputs the ES6 export statements and their corresponding JSDoc comments in human-readable format.
4+
5+
Some characteristics:
6+
7+
* If the export statement doesn't contain any JSDoc, it'll look up for JSDoc up to the declaration.
8+
* It can resolve relative dependencies, either files or directories. For example, `import default from './dependency'` will find `dependency.js` or `dependency/index.js`
9+
10+
## Installation
11+
12+
Install the module
13+
14+
```bash
15+
npm install @wordpress/docgen --save-dev
16+
```
17+
18+
## Usage
19+
20+
```bash
21+
npx docgen <entry-point.js>
22+
```
23+
24+
This command will generate a file named `entry-point-api.md` containing all the exports and their JSDoc comments.
25+
26+
### CLI options
27+
28+
* **--formatter** `(String)`: A path to a custom formatter to control the contents of the output file. It should be a CommonJS module that exports a function that takes as input:
29+
* *rootDir* `(String)`: current working directory as seen by docgen.
30+
* *docPath* `(String)`: path of the output document to generate.
31+
* *symbols* `(Array)`: the symbols found.
32+
* **--ignore** `(RegExp)`: A regular expression used to ignore symbols whose name match it.
33+
* **--output** `(String)`: Output file that will contain the API documentation.
34+
* **--to-section** `(String)`: Append generated documentation to this section in the Markdown output. To be used by the default Markdown formatter. Depends on `--output` and bypasses the custom `--formatter` passed, if any.
35+
* **--to-token**: Embed generated documentation within the start and end tokens in the Markdown output. To be used by the default Markdown formatter.Depends on `--output` and bypasses the custom `--formatter` passed, if any.
36+
* Start token: `<!-- START TOKEN(Autogenerated API docs) -->`
37+
* End token: `<!-- END TOKEN(Autogenerated API docs) -->`
38+
* **--use-token** `(String)`: This options allows you to customize the string between the tokens. For example, `--use-token my-api` will look up for the start token `<!-- START TOKEN(my-api) -->` and the end token `<!-- END TOKEN(my-api) -->`. Depends on `--to-token`.
39+
* **--debug**: Run in debug mode, which outputs some intermediate files useful for debugging.
40+
41+
## Examples
42+
43+
### Default export
44+
45+
Entry point `index.js`:
46+
47+
```js
48+
/**
49+
* Adds two numbers.
50+
*
51+
* @param {number} term1 First number.
52+
* @param {number} term2 Second number.
53+
* @return {number} The result of adding the two numbers.
54+
*/
55+
export default function addition( term1, term2 ) {
56+
// Implementation would go here.
57+
}
58+
```
59+
60+
Output of `npx docgen index.js` would be `index-api.js`:
61+
62+
```markdown
63+
# API
64+
65+
## default
66+
67+
[example.js#L8-L10](example.js#L8-L10)
68+
69+
Adds two numbers.
70+
71+
**Parameters**
72+
73+
- **term1** `number`: First number.
74+
- **term2** `number`: Second number.
75+
76+
**Returns**
77+
78+
`number` The result of adding the two numbers.
79+
```
80+
81+
### Named export
82+
83+
Entry point `index.js`:
84+
85+
```js
86+
/**
87+
* Adds two numbers.
88+
*
89+
* @param {number} term1 First number.
90+
* @param {number} term2 Second number.
91+
* @return {number} The result of adding the two numbers.
92+
*/
93+
function addition( term1, term2 ) {
94+
return term1 + term2;
95+
}
96+
97+
/**
98+
* Adds two numbers.
99+
*
100+
* @deprecated Use `addition` instead.
101+
*
102+
* @param {number} term1 First number.
103+
* @param {number} term2 Second number.
104+
* @return {number} The result of adding the two numbers.
105+
*/
106+
function count( term1, term2 ) {
107+
return term1 + term2;
108+
}
109+
110+
export { count, addition };
111+
```
112+
113+
Output of `npx docgen index.js` would be `index-api.js`:
114+
115+
```markdown
116+
# API
117+
118+
## addition
119+
120+
[example.js#L25-L25](example.js#L25-L25)
121+
122+
Adds two numbers.
123+
124+
**Parameters**
125+
126+
- **term1** `number`: First number.
127+
- **term2** `number`: Second number.
128+
129+
**Returns**
130+
131+
`number` The result of adding the two numbers.
132+
133+
## count
134+
135+
[example.js#L25-L25](example.js#L25-L25)
136+
137+
> **Deprecated** Use `addition` instead.
138+
139+
Adds two numbers.
140+
141+
**Parameters**
142+
143+
- **term1** `number`: First number.
144+
- **term2** `number`: Second number.
145+
146+
**Returns**
147+
148+
`number` The result of adding the two numbers.
149+
```
150+
151+
### Namespace export
152+
153+
Let the entry point be `index.js`:
154+
155+
```js
156+
export * from './count';
157+
```
158+
159+
with `./count/index.js` contents being:
160+
161+
```js
162+
/**
163+
* Substracts two numbers.
164+
*
165+
* @example
166+
*
167+
* ```js
168+
* const result = substraction( 5, 2 );
169+
* console.log( result ); // Will log 3
170+
* ```
171+
*
172+
* @param {number} term1 First number.
173+
* @param {number} term2 Second number.
174+
* @return {number} The result of subtracting the two numbers.
175+
*/
176+
export function substraction( term1, term2 ) {
177+
return term1 - term2;
178+
}
179+
180+
/**
181+
* Adds two numbers.
182+
*
183+
* @example
184+
*
185+
* ```js
186+
* const result = addition( 5, 2 );
187+
* console.log( result ); // Will log 7
188+
* ```
189+
*
190+
* @param {number} term1 First number.
191+
* @param {number} term2 Second number.
192+
* @return {number} The result of adding the two numbers.
193+
*/
194+
export function addition( term1, term2 ) {
195+
// Implementation would go here.
196+
return term1 - term2;
197+
}
198+
```
199+
200+
Output of `npx docgen index.js` would be `index-api.js`:
201+
202+
````markdown
203+
# API
204+
205+
## addition
206+
207+
[example-module.js#L1-L1](example-module.js#L1-L1)
208+
209+
Adds two numbers.
210+
211+
**Usage**
212+
213+
```js
214+
const result = addition( 5, 2 );
215+
console.log( result ); // Will log 7
216+
```
217+
218+
**Parameters**
219+
220+
- **term1** `number`: First number.
221+
- **term2** `number`: Second number.
222+
223+
**Returns**
224+
225+
`number` The result of adding the two numbers.
226+
227+
## substraction
228+
229+
[example-module.js#L1-L1](example-module.js#L1-L1)
230+
231+
Substracts two numbers.
232+
233+
**Usage**
234+
235+
```js
236+
const result = substraction( 5, 2 );
237+
console.log( result ); // Will log 3
238+
```
239+
240+
**Parameters**
241+
242+
- **term1** `number`: First number.
243+
- **term2** `number`: Second number.
244+
245+
**Returns**
246+
247+
`number` The result of subtracting the two numbers.
248+
````
249+
250+
<br/><br/><p align="center"><img src="https://s.w.org/style/images/codeispoetry.png?1" alt="Code is Poetry." /></p>

‎packages/docgen/bin/cli.js‎

Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
#!/usr/bin/env node
2+
3+
const docgen = require( '../src' );
4+
5+
const optionator = require( 'optionator' )( {
6+
prepend: 'Usage: node <path-to-docgen> <relative-path-to-entry-point>',
7+
options: [ {
8+
option: 'formatter',
9+
type: 'String',
10+
description: 'A custom function to format the generated documentation. By default, a Markdown formatter will be used.',
11+
}, {
12+
option: 'output',
13+
type: 'String',
14+
description: 'Output file to contain the API documentation.',
15+
}, {
16+
option: 'ignore',
17+
type: 'RegExp',
18+
description: 'A regular expression used to ignore symbols whose name match it.',
19+
}, {
20+
option: 'to-section',
21+
type: 'String',
22+
description: 'Append generated documentation to this section in the Markdown output. To be used by the default Markdown formatter.',
23+
dependsOn: 'output',
24+
}, {
25+
option: 'to-token',
26+
type: 'Boolean',
27+
description: 'Embed generated documentation within this token in the Markdown output. To be used by the default Markdown formatter.',
28+
dependsOn: 'output',
29+
}, {
30+
option: 'use-token',
31+
type: 'String',
32+
default: 'Autogenerated API docs',
33+
description: 'Add this string to the start/end tokens.',
34+
dependsOn: 'to-token',
35+
}, {
36+
option: 'debug',
37+
type: 'Boolean',
38+
default: false,
39+
description: 'Run in debug mode, which outputs some intermediate files useful for debugging.',
40+
} ],
41+
} );
42+
43+
const options = optionator.parseArgv( process.argv );
44+
docgen( options._[ 0 ], options );

0 commit comments

Comments
 (0)