Как создать файл определения типизации .d.ts из существующей библиотеки JavaScript?

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

  •  12-12-2019
  •  | 
  •  

Вопрос

Я использую множество библиотек, как своих, так и сторонних.Я вижу, что каталог «typings» содержит некоторые файлы для Jquery и WinRT...но как они создаются?

Это было полезно?

Решение

Вам доступно несколько вариантов в зависимости от рассматриваемой библиотеки, того, как она написана и какой уровень точности вы ищете.Давайте рассмотрим варианты примерно в порядке убывания желательности.

Возможно, оно уже существует

Всегда проверяйте DefiniteTyped (https://github.com/DefiniteTyped/DefiniteTyped) первый.Это репозиторий сообщества, полный буквально тысяч файлов .d.ts, и весьма вероятно, что то, что вы используете, уже там.Вам также следует проверить TypeSearch (https://microsoft.github.io/TypeSearch/) — поисковая система для файлов .d.ts, опубликованных NPM;здесь будет немного больше определений, чем в DefiniteTyped.Некоторые модули также поставляют свои собственные определения как часть дистрибутива 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 как описывает Райан, или вы можете указать declaration: true под compilerOptionsв вашей tsconfig.json предполагая, что у вас уже был tsconfig.json под ваш проект.

Лучший способ справиться с этим (если файл декларации не доступен на определенноtytyped )Написать декларации только для вещей, которые вы используете, а не всю библиотеку.Это значительно снижает работу - и дополнительно компилятор, чтобы помочь, жалуясь на недостающие методы.

Как говорит Райан, в компиляторе tsc есть переключатель --declaration который генерирует .d.ts файл из .ts файл.Также обратите внимание, что (за исключением ошибок) TypeScript должен иметь возможность компилировать Javascript, поэтому вы можете передать существующий код JavaScript в компилятор tsc.

Как описано в http://channel9.msdn.COM / POSTA / Anders-Hejlsberg-Steve-lucco-and-luke-hoban-inside-tymdercript в 00:33:52 Они построили инструмент для преобразования метаданных WebIDL и WinRT в Tymdscript D.ts

Вот некий PowerShell, который создает один файл определения TypeScript — библиотеку, включающую несколько *.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 файл, который включает в себя множество определений.

Я бы искал существующее сопоставление ваших третий библиотек JS JS, которые поддерживают сценарий # или Sharpkit.Пользователи этих C # к Cross Compilers столкнулись с проблемой, который вы сейчас находитесь, и, возможно, опубликовал программу открытого исходного кода для сканирования вашей третий Party Lib и конвертировать в классы скелета C #.Если так взломать программу сканера для генерации Teamscript на месте C #.

Не удалось, что перевод общедоступного интерфейса C # для вашей 3-й партии lib в определения в 3-х годах могут быть проще, чем делать то же самое, чтение источника JavaScript.

Мой особый интерес - это Framework Sencha's Extjs Ria, и я знаю, что были проекты, опубликованные для создания интерпретации C # для сценария # или Sharpkit

При создании собственной библиотеки вы можете создавать *.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