JavaScript 파일용 TypeScript 선언 파일 생성

3483 단어 javascripttypescriptdevelopment
여러 프로젝트에서 사용하는 몇 가지utilities를 npm 라이브러리로 옮겼습니다. 하지만 TypeScript를 주로 사용하기 때문에 TypeScript 선언을 생성하는 쉽고 안정적인 방법이 필요했습니다.
  • 프로젝트를 열고 package.json
    • 가 있는지 확인합니다.
  • typescript 라이브러리를 개발 종속성으로 설치
  • pnpm : pnpm i -D typescript
  • npm : npm i -D typescript
  • yarn : yarn add typescript -D


  • 함수, 변수, 클래스 등에 JSDoc tags을 추가하십시오.

    예를 들어, 다음은 one of my utilities의 스니펫입니다.

    /**
* Apply classes that result in a true condition
* @param {string[]} classes
* @returns A list of classes
*
* @example
* classNames("block truncate", selected ? "font-medium" : "font-normal")
*/
export const classNames = (...classes) => {
return classes.filter(Boolean).join(" ");
};


  • prepare script(또는 사용하려는 항목)을 scripts의 package.json 개체에 추가합니다.

    예를 들어 내 모습은 다음과 같습니다.

    "scripts": {
"prepare": "tsc --declaration --emitDeclarationOnly --allowJs index.js"
},


    이 명령은 TypeScript 컴파일러인 tsc 를 실행하고 .d.ts 파일(선언 파일)만 생성하도록 지시합니다. index.js를 JavaScript 파일로 바꾸십시오.
    prepare 스크립트는 npm 패키지가 압축되기 전에 실행됩니다(일반적으로 npm publish 또는 npm pack 또는 다른 패키지 관리자와 동등한 패키지 사용).

  • npm 스크립트 실행
  • pnpm 포함: pnpm prepare 또는 pnpm run prepare
  • npm : npm run prepare
  • yarn : yarn run prepare


    • 위의 classNames 함수를 사용하여 TypeScript 컴파일러는 다음 선언을 생성했습니다.

    export function classNames(...classes: string[]): string;


    질문이 있으시면 저에게 트윗을 보내주세요. 이 가이드가 도움이 되었기를 바랍니다. 읽어주셔서 감사합니다!
    Ruby에서 워드 클라우드를 이용한 Twitter 트렌드 시각화
    자바스크립트 게터 및 세터

    좋은 웹페이지 즐겨찾기

    개발자 우수 사이트 수집

    개발자가 알아야 할 필수 사이트 100선 추천 우리는 당신을 위해 100개의 자주 사용하는 개발자 학습 사이트를 정리했습니다
    best100-homepage