기존 JavaScript 라이브러리에서 .d.ts "입력" 정의 파일을 어떻게 생성합니까?

StackOverflow https://stackoverflow.com//questions/12687779

  •  12-12-2019
  •  | 
  •  

문제

나는 내 라이브러리와 타사 라이브러리를 많이 사용하고 있습니다."typings" 디렉터리에 Jquery 및 WinRT에 대한 일부 내용이 포함되어 있는 것을 확인했습니다.하지만 그것들은 어떻게 만들어지나요?

도움이 되었습니까?

해결책

문제의 라이브러리, 작성 방법, 원하는 정확도 수준에 따라 몇 가지 옵션을 사용할 수 있습니다.대략적으로 바람직함의 내림차순으로 옵션을 검토해 보겠습니다.

어쩌면 이미 존재할 수도 있습니다.

항상 DefinedTyped를 확인하세요(https://github.com/DefinitelyTyped/DefinitelyTyped) 첫 번째.이것은 말 그대로 수천 개의 .d.ts 파일로 가득 찬 커뮤니티 저장소이며, 사용 중인 파일이 이미 거기에 있을 가능성이 매우 높습니다.TypeSearch도 확인해야 합니다(https://microsoft.github.io/TypeSearch/) 이는 NPM 게시 .d.ts 파일에 대한 검색 엔진입니다.이는 DefinedTyped보다 약간 더 많은 정의를 갖습니다.몇몇 모듈은 NPM 배포판의 일부로 자체 정의를 제공하므로 직접 작성하기 전에 그러한 경우인지 확인하세요.

어쩌면 당신은 필요하지 않을 수도 있습니다

TypeScript는 이제 다음을 지원합니다. --allowJs 플래그를 지정하고 .js 파일에서 더 많은 JS 기반 추론을 수행합니다.다음과 함께 .js 파일을 컴파일에 포함시켜 볼 수 있습니다. --allowJs 이것이 충분한 유형 정보를 제공하는지 확인하기 위한 설정입니다.TypeScript는 이러한 파일에서 ES5 스타일 클래스 및 JSDoc 주석과 같은 항목을 인식하지만 라이브러리가 이상한 방식으로 자체적으로 초기화되면 문제가 발생할 수 있습니다.

시작하기 --allowJs

만약에 --allowJs 괜찮은 결과를 얻었고 더 나은 정의 파일을 직접 작성하고 싶다면 결합할 수 있습니다. --allowJs ~와 함께 --declaration 라이브러리 유형에 대한 TypeScript의 "최상의 추측"을 확인합니다.이는 적절한 출발점이 될 것이며, JSDoc 주석이 잘 작성되어 있고 컴파일러가 이를 찾을 수 있다면 손으로 작성한 파일만큼 좋을 수 있습니다.

dts-gen 시작하기

만약에 --allowJs 작동하지 않았습니다. dts-gen을 사용하고 싶을 수도 있습니다(https://github.com/Microsoft/dts-gen) 시작점을 얻으려면.이 도구는 개체의 런타임 형태를 사용하여 사용 가능한 모든 속성을 정확하게 열거합니다.장점으로는 이것이 매우 정확한 경향이 있지만 이 도구는 추가 유형을 채우기 위해 JSDoc 주석을 스크랩하는 것을 아직 지원하지 않습니다.다음과 같이 실행합니다.

npm install -g dts-gen
dts-gen -m <your-module>

이것은 생성됩니다 your-module.d.ts 현재 폴더에 있습니다.

스누즈 버튼을 누르세요

나중에 모든 작업을 수행하고 한동안 유형 없이 지내고 싶다면 TypeScript 2.0에서 이제 다음을 작성할 수 있습니다.

declare module "foo";

그러면 당신은 import 그만큼 "foo" 유형이 있는 모듈 any.나중에 다루고 싶은 전역변수가 있다면 다음과 같이 작성하세요.

declare const foo: any;

그것은 당신에게 줄 것입니다 foo 변하기 쉬운.

다른 팁

다음 중 하나를 사용할 수 있습니다. tsc --declaration fileName.ts Ryan이 설명한 것처럼 또는 지정할 수 있습니다. declaration: true 아래에 compilerOptions당신의 tsconfig.json 당신이 이미 가지고 있다고 가정 tsconfig.json 귀하의 프로젝트에서.

이 문제를 다루는 가장 좋은 방법은 ( relinselytyped 에서 사용할 수없는 경우)는 다음과 같습니다.전체 라이브러리가 아닌 사용하는 것에 대해서만 선언을 작성하십시오.이렇게하면 작업이 많이 줄어들고 추가로 컴파일러가 누락 된 방법에 대해 불평함으로써 도움이됩니다.

Ryan이 말했듯이 tsc 컴파일러에는 스위치가 있습니다 --declaration 이는 .d.ts 의 파일 .ts 파일.또한 (버그 제외) TypeScript는 Javascript를 컴파일할 수 있어야 하므로 기존 Javascript 코드를 tsc 컴파일러에 전달할 수 있습니다.

http : //channel9.msdn.com / posts / anders-hejlsberg-steve-lucco-and-luke-hoban-inside typescript 00:33:52 00:33:52 그들은 WebIDL 및 WinRT 메타 데이터를 Typescript D.TS

다음은 여러 개의 TypeScript 정의 파일을 포함하는 라이브러리를 생성하는 일부 PowerShell입니다. *.js 최신 JavaScript가 포함된 파일.

먼저 모든 확장자를 다음으로 변경하십시오. .ts.

Get-ChildItem | foreach { Rename-Item $_ $_.Name.Replace(".js", ".ts") }

둘째, TypeScript 컴파일러를 사용하여 정의 파일을 생성합니다.많은 컴파일러 오류가 있지만 이를 무시할 수 있습니다.

Get-ChildItem | foreach { tsc $_.Name  }

마지막으로 모든 것을 합친다. *.d.ts 파일을 하나로 index.d.ts, 제거 import 진술 및 제거 default 각 수출 명세서에서.

Remove-Item index.d.ts; 

Get-ChildItem -Path *.d.ts -Exclude "Index.d.ts" | `
  foreach { Get-Content $_ } | `
  where { !$_.ToString().StartsWith("import") } | `
  foreach { $_.Replace("export default", "export") } | `
  foreach { Add-Content index.d.ts $_ }

이것은 사용 가능한 단일로 끝납니다. index.d.ts 많은 정의가 포함된 파일입니다.

스크립트 # 또는 SharkKit을 지원하는 제 3 자 JS 라이브러리의 기존 매핑을 찾습니다.이러한 C #의 사용자가 .js 크로스 컴파일러는 이제 문제에 직면 해 있으며 제 3 자 lib를 스캔하여 뼈대 C # 클래스로 변환하는 오픈 소스 프로그램을 게시했습니다.그렇다면 스캐너 프로그램이 C #. 대신 Typescript를 생성하도록 해킹하십시오.

실패하지 않아도 3 번째 파티 LIB에 대한 C # Public 인터페이스를 TypeScript 정의로 변환하는 것이 소스 JavaScript를 읽음으로써 동일한 작업보다 간단 할 수 있습니다.

나의 특별한 관심은 Sencha의 Extjs Ria Framework이며, 스크립트 # 또는 SharpKit에 대한 C # 해석을 생성하기 위해 프로젝트가 출판 된 것으로 알고 있습니다.

자신만의 라이브러리를 만들 때 다음을 만들 수 있습니다. *.d.ts 파일을 사용하여 tsc (TypeScript 컴파일러) 명령은 다음과 같습니다.(라이브러리를 다음과 같이 구축한다고 가정합니다. dist/lib 폴더)

tsc -d --declarationDir dist/lib --declarationMap --emitDeclarationOnly
  • -d (--declaration):생성합니다 *.d.ts 파일
  • --declarationDir dist/lib:생성된 선언 파일의 출력 디렉터리입니다.
  • --declarationMap:각 해당 '.d.ts' 파일에 대한 소스맵을 생성합니다.
  • --emitDeclarationOnly:'.d.ts' 선언 파일만 내보냅니다.(컴파일된 JS 없음)

(참조 문서 모든 명령줄 컴파일러 옵션에 대해)

아니면 예를 들어 package.json:

"scripts": {
    "build:types": "tsc -d --declarationDir dist/lib --declarationMap --emitDeclarationOnly",
}

그런 다음 다음을 실행하십시오. yarn build:types (또는 npm run build:types)

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top