@vercel/edge의 TypeDoc 사용법

이 글에서는 @vercel/edge 패키지의 TypeDoc 사용법을 분석합니다.

typedoc.json이라는 파일을 발견하고 TypeDoc이 무엇인지 궁금해졌고, 빠른 Google 검색을 통해 TypeDoc 웹사이트를 찾는 데 도움이 되었습니다.

그럼 TypeDoc은 무엇인가요?

타입닥

TypeDoc은 TypeScript 소스 코드의 주석을 렌더링된 HTML 문서 또는 JSON 모델로 변환합니다. 확장 가능하며 다양한 구성을 지원합니다. CLI 또는 노드 모듈로 사용 가능합니다.

TypeDoc 문서는 포괄적입니다. 이제 @vercel/edge에서 이것이 어떻게 사용되는지 살펴보겠습니다.

@vercel/edge의 typedoc.json 구성:

아래 코드는 packages/edge/typedoc.json에서 선택되었습니다.

{
 "$schema": "https://typedoc.org/schema.json",
 "entryPoints": ["src/index.ts"],
 "plugin": ["typedoc-plugin-markdown", "typedoc-plugin-mdn-links"],
 "out": "docs",
 "githubPages": false,
 "gitRevision": "main",
 "readme": "none",
 "hideBreadcrumbs": true
}

CLI를 사용하여 TypeDoc을 실행할 때 이 구성이 필요합니다.

"out" 값에 주의하세요. "docs"입니다. @vercel/edge 패키지에 대해 이미 생성된 문서가 있다는 것은 좋은 일입니다

수정된 요청 인터페이스:

middleware-helpers.ts에 있는 ModifiedRequest 인터페이스를 선택하겠습니다

export interface ModifiedRequest {
 /**
 * If set, overwrites the incoming headers to the origin request.
 *
 * This is useful when you want to pass data between a Middleware and a
 * Serverless or Edge Function.
 *
 * @example
 * <caption>Add a `x-user-id` header and remove the `Authorization` header</caption>
 *
 * ```

ts
 * import { rewrite } from '@vercel/edge';
 * export default async function middleware(request: Request): Promise<Response> {
 * const newHeaders = new Headers(request.headers);
 * newHeaders.set('x-user-id', 'user_123');
 * newHeaders.delete('authorization');
 * return rewrite(request.url, {
 * request: { headers: newHeaders }
 * })
 * }
 *

*/
헤더?: 헤더;
}

This interface has a comment added that is picked by TypeDoc and is made available in docs at [edge/docs/interfaces/ModifiedRequest.md](https://github.com/vercel/vercel/blob/main/packages/edge/docs/interfaces/ModifiedRequest.md)

But what’s the command this package uses to initiate documentation generation? It can be found in [package.json](https://github.com/vercel/vercel/blob/main/packages/edge/package.json#L19)



```plaintext
"build:docs": "typedoc && node scripts/fix-links.js && prettier - write docs/**/*.md docs/*.md",

docs 폴더에 보시면 더 예쁘게 적용된 것을 보실 수 있습니다.

회사 소개:

Think Throo에서는 오픈 소스 프로젝트에 사용되는 고급 코드베이스 아키텍처 개념을 가르치는 임무를 수행하고 있습니다.

Next.js/React에서 고급 아키텍처 개념을 연습하여 코딩 기술을 10배, 모범 사례를 배우고 프로덕션급 프로젝트를 구축하세요.

저희는 오픈 소스입니다 — https://github.com/thinkthroo/thinkthroo(별표를 주세요!)

또한 웹 개발 및 기술 문서 작성 서비스도 제공합니다. 자세한 내용은 hello@thinkthroo.com으로 문의하세요!

참고자료:

1. https://github.com/vercel/vercel/blob/main/packages/edge/typedoc.jso

2. https://github.com/TypeStrong/typedoc

3. https://typedoc.org/

4. https://github.com/vercel/vercel/blob/main/packages/edge/docs

5. https://github.com/vercel/vercel/blob/main/packages/edge/docs/interfaces/ModifiedRequest.md

6. https://github.com/vercel/vercel/blob/main/packages/edge/src/middleware-helpers.ts#L1

위 내용은 @vercel/edge의 TypeDoc 사용법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!