programing

ReactJs에서 문서를 작성하는 방법

newstyles 2023. 4. 4. 21:08

ReactJs에서 문서를 작성하는 방법

reactjs 어플리케이션에서 정의한 각 컴포넌트의 doc 파일을 작성해야 합니다.모든 확장자의 문서를 작성할 때 사용할 수 있는npm을 찾고 있습니다.그러면 코드를 추출하고 모든 컴포넌트에 코멘트를 달아 그것을 확장자의 문서로 변경할 수 있습니다.제가 어떻게 도와드리면 될까요?jsdoc을 사용하여 reactjs에서 문서를 찾고 있기 때문에 jsdoc에 관한 질문과는 다른 질문입니다.

드디어 해결책을 찾았습니다.먼저 이 링크에 접속하여 문서를 올바르게 읽습니다.- 지금 바로 문서를 읽습니다.-

  • 명령 프롬프트 열기
  • 명령어 npm install jsdoc -g를 사용하여 JSDoc을 글로벌하게 설치합니다.
  • 이제 프로젝트 폴더의 경로로 이동하여 jsdoc src -r -d docs 명령을 실행합니다.
  • Above command will create the document in the doc folder of the your project directory.

    React Styleguidist를 사용하여 React 구성 요소 라이브러리를 문서화합니다.

    다음의 기능을 사용해 코드를 해석합니다.

    • 정의한 PropTypes에서 API / 소품 문서를 생성합니다.
    • 사용자가 쉽게 스니펫을 복사할 수 있는 편집 가능한 실시간 예제 문서를 작성합니다.
    • 설정성이 뛰어나고 내부 문서를 얻기 위해 핫 새로고침이 가능합니다.

    웹 팩을 통해 모든 개발자를 위해 로컬로 사용하거나 호스트할 수 있는 웹 앱을 구축하여 작동합니다.

    우리에게는 꽤 잘 작동하고 시간이 지남에 따라 개선됩니다.

    편집: 후드 아래에 react-docgen을 사용합니다.

    이 패키지에는 당신이 이해할 수 있는 예가 포함되어 있습니다.

    React.createClass, ES2015 클래스 정의 또는 함수(스테이트리스 구성 요소)를 통해 정의된 React 구성 요소에 대한 기본 구현을 제공합니다.이러한 컴포넌트 정의는 분석 가능하기 위해 특정 가이드라인을 따라야 합니다(자세한 내용은 아래 참조).

    https://www.npmjs.com/package/@rtsao/http-docgen

    JSDoc에는 better-docs라는 테마가 있으며 @component 플러그인이 있습니다.컴포넌트에 추가하면(다른 태그와 마찬가지로) 모든 propType을 해석하고 문서를 생성합니다.또한 @example 태그와 함께 사용하면 better-docs가 라이브 미리보기를 인쇄합니다.

    리액션 컴포넌트 립이 많고 리액션 쇼룸을 사용합니다.

    여기에 이미지 설명 입력

    마크다운으로 문서를 작성할 수 있으며 샌드박스가 있습니다.이 방법의 큰 장점 - 이미 구성된 웹 팩, 바벨, 보풀 등을 사용하여 2분 만에 새로운 프로젝트를 시작할 수 있습니다.

    꼭 시도해 보세요.

    react-docgen을 위한 작은 포장지를 작성했습니다.그것은 조금 더 간단하게 조작할 수 있습니다.전달된 폴더의 모든 구성 요소에 대한 마크다운 파일을 내보냅니다.

    프로젝트 체크 https://github.com/LaustAxelsen/wilster-doc

    언급URL : https://stackoverflow.com/questions/41847565/how-to-do-documentation-in-reactjs