كيف يمكنك إنتاج ملف تعريف "الكتابات" .d.ts من مكتبة JavaScript موجودة؟

Question

أنا أستخدم الكثير من المكتبات الخاصة بي والمكتبات التابعة لجهات خارجية.أرى أن دليل "الكتابات" يحتوي على بعض العناصر الخاصة بـ Jquery وWinRT...ولكن كيف يتم خلقهم؟

Answer 1

هناك بعض الخيارات المتاحة لك اعتمادًا على المكتبة المعنية وكيفية كتابتها ومستوى الدقة الذي تبحث عنه.دعونا نراجع الخيارات، بترتيب تنازلي تقريبًا حسب الرغبة.

ربما كان موجودا بالفعل

تحقق دائمًا من DefinitelyTyped (https://github.com/DefinitelyTyped/DefinitelyTyped) أولاً.هذا عبارة عن مستودع مجتمعي مليء بالآلاف من ملفات .d.ts ومن المحتمل جدًا أن يكون الشيء الذي تستخدمه موجودًا بالفعل.يجب عليك أيضًا التحقق من TypeSearch (https://microsoft.github.io/TypeSearch/) وهو محرك بحث لملفات .d.ts المنشورة بواسطة NPM؛سيكون لهذا تعريفات أكثر قليلاً من DefinitelyTyped.تقوم بعض الوحدات أيضًا بشحن تعريفاتها الخاصة كجزء من توزيع 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 عامل.

Answer 2

يمكنك إما استخدام tsc --declaration fileName.ts كما يصف ريان، أو يمكنك تحديد declaration: true تحت compilerOptionsفي الخاص بك tsconfig.json على افتراض أن لديك بالفعل tsconfig.json تحت مشروعك

Answer 3

أفضل طريقة للتعامل مع هذا (إذا كان ملف تعريف غير متوفر على definitelypeypled ) هواكتب الإعلانات فقط للأشياء التي تستخدمها بدلا من المكتبة بأكملها.هذا يقلل من العمل كثيرا - بالإضافة إلى ذلك، هناك مترجم موجود للمساعدة من خلال الشكوى حول الأساليب المفقودة.

Answer 4

كما يقول ريان، المترجم tsc لديه مفتاح التبديل --declaration الذي يولد أ .d.ts ملف من أ .ts ملف.لاحظ أيضًا أنه (باستثناء الأخطاء) من المفترض أن يكون TypeScript قادرًا على ترجمة Javascript، حتى تتمكن من تمرير كود جافا سكريبت الموجود إلى مترجم tsc.

Answer 5

كما هو موضح في http://channel9.msdn.COM / Works / Anders-Hejlsberg-Steve-Lucco-and-Luke-Hoban-Inside-Insidefcript في 00:33:52 قاموا ببناء أداة لتحويل WebDeDL و WinRT البيانات الوصفية في Cydscript D.ts

Answer 6

إليك بعض PowerShell الذي يقوم بإنشاء ملف تعريف TypeScript واحد ومكتبة تتضمن عدة ملفات تعريف *.js الملفات مع جافا سكريبت الحديثة.

أولاً، قم بتغيير جميع الامتدادات إلى .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 ملف يتضمن العديد من التعريفات.

Answer 7

أود أن أبحث عن تعيين موجود لمكتباتك الثالثة من مكتباتك التي تدعم البرنامج النصي أو Sharpkit.ستواجه مستخدمو هذه المحاميلات C # إلى .JS المشكلة التي تواجهها الآن وربما نشر برنامج مفتوح المصدر لمسح الطرف الثالث الخاص بك ويحوله إلى فئات هيكل عظمي C #.إذا كان الأمر كذلك اخترق برنامج الماسح الضوئي لتوليد Disscript بدلا من C #.

الفشل في ذلك، قد يكون ترجمة واجهة عامة C # ل Lib للحزب الثالث الخاص بك إلى تعريفات Cydycript أكثر بساطة من القيام بذلك عن طريق قراءة JavaScript المصدر.

اهتمامي الخاص هو إطار Sencha's Extjs Ria وأعرف أن هناك مشاريع تم نشرها لتوليد تفسير C # للحصول على برنامج نصي أو Sharpkit

Answer 8

عند إنشاء مكتبتك الخاصة، يمكنك إنشاءها *.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)