Typescript: السماح بتعريفات الوحدة النمطية كمتغيرات عالمية

تم إنشاؤها على ١٥ مايو ٢٠١٥  ·  11تعليقات  ·  مصدر: microsoft/TypeScript

لدي ملف تعريف نوع React (الذي تم الإعلان عنه باستخدام وحدة خارجية). في ملفات المصدر الخاصة بي ، عادةً ما أفعل:

import * as R from "react"

ويمكنه حينئذٍ استخدام R.createElement(... إلخ بطريقة مكتوبة بشدة. يمكنني حتى أن أفعل:

let _r = R;
_r.createElement(...

ما أريده هو ألا أضطر إلى استيراد R في كل ملف ، وبدلاً من ذلك اجعله كإعلان عالمي (نعم ، أنا على استعداد لإضفاء الطابع العالمي على مساحة الاسم العالمية ببعض المتغيرات). لقد حاولت ، في .d.ts :

import * as React from "react";
declare var R : React;

هذا لا يعمل على الرغم من أنني حصلت على "لا يمكن العثور على اسم 'React'". هل هناك طريقة أخرى لتصدير الوحدة بأكملها على أنها عالمية ، دون تعديل رد الفعل الأساسي. d.ts؟

Question

التعليق الأكثر فائدة

مرحبًا Evertt بالفعل أنا أتلقى هذا الخطأ الآن أيضًا. في البداية ، لم يكن كود المصدر الخاص بي يستخدم بناء جملة الوحدة النمطية ES6 ولكن بمجرد إعادة هيكلة بعض الملفات إلى هذا النحو ، حصلت على نفس الخطأ. قمت ببعض الأبحاث وما نجح معي الآن هو عندما أنشأت ملفًا ثانيًا globals.d.ts وأضعه أيضًا في مجلد الكتابة:

import * as _R from 'ramda';
import * as _mobx from 'mobx';

declare global {
  const R: typeof _R;
  const mobx: typeof _mobx;
}

في الواقع ، يبدو أن هذا الملف وحده "يلبي" المترجم المطبوع عليه ، لذا من الناحية النظرية لن تحتاج إلى الملفات الأخرى التي ذكرتها سابقًا. ومع ذلك ، في حالتي الخاصة (أنا أستخدم WebStorm) عندما يكون لدي ملف globals.d.ts فقط ، كان IDE الخاص بي يضغط علي باستمرار لاستيراد الوحدات ، كما أن الإكمالات على تلك الكرة الأرضية كانت غير مكتملة. لذلك احتفظت الآن بشكل أساسي بكلا الملفين في دليل الكتابة الذي يلبي الكتابة المطبوعة و IDE. ليس لطيفًا حقًا ، ولكن بالنسبة لعدد قليل من الكرات الأرضية التي يستخدمها المرء عادةً ، أعتقد أنه من الجيد الاحتفاظ بهذه الملفات.

هذا هو tsconfig.json الخاص بي للمرجع:

{
  "compilerOptions": {
    "target": "ES5",
    "module": "amd",
    "moduleResolution": "node",
    "experimentalDecorators": true,
    "lib": [
      "ES6",
      "DOM",
      "ScriptHost"
    ],
    "sourceMap": true,
    "strictNullChecks": true
  },
  "include": [
    "types/**/*",
    "src/**/*"
  ]
}

أنا لا أستخدم حزمة الويب أو أي شيء لحزم. أقوم فقط بترجمة الملفات الفردية وتحميلها عبر نظام الوحدة النمطية https://github.com/SAP/openui5 (الذي يشبه AMD) وقم بتجميعها للإنتاج فقط.

نسخة مطبوعة هي: 2.2.1

امل ان يساعد.

ال 11 كومينتر

لا يمكن القيام بذلك لأن الدقيقة التي تضيف فيها تصريحًا import إلى ملف المصدر يعتبر وحدة خارجية. أي سبب لعدم استخدامك لملف تعريف React الذي يستخدم ملفًا عامًا؟

https://github.com/borisyankov/DefinitelyTyped/blob/master/react/react-global.d.ts

يبدو لي أن هذا سيحل المشكلة.

لقد جربت بالفعل react-global.d.ts أيضًا ، والذي من الواضح أنه يضع React في الفضاء العالمي ، ولكن كيف يمكنني إعادة تسميته عالميًا وإعلام Typescript به؟

declare var _r = React;  // error Cannot find name 'React';

ستكون حالة الاستخدام الحقيقية الخاصة بي هي أن أكون قادرًا على رفع وحدة نمطية مساعدة / مشتركة إلى الفضاء العالمي ، لذلك لا يتعين علي استخدام مجموعة من واردات المسار النسبي للوصول إليها. يمكنني القيام بذلك في Javascript ، لكنني أجد صعوبة في كيفية إخبار المترجم الإنشائي أنني قمت بذلك.

ahejlsberg - أنا متأكد من أن لديك الكثير من الأشياء التي يجب عليك القيام بها أكثر من تحمل تأملاتي في حالات الحافة ... :)

يمكنك على سبيل المثال إنشاء ملف إعلان r.d.ts :

/// <reference path="react-global.d.ts"/>
declare var R: typeof React;

ثم قم بالإشارة إلى هذا الملف في كل مكان. أو حتى أفضل:

/// <reference path="react-global.d.ts"/>
import R = React;

مما سيسمح لك أيضًا بالإشارة إلى الأنواع من React كـ R.xxx.

لم أر استخدام typeof قبل - رائع جدًا. يعمل هذا بشكل رائع للوحدات النمطية المحددة بالفعل من .d.ts ، لكنني ما زلت لا أرى طريقة لرفع وحدة خارجية محددة في Typescript إلى المساحة العامة ولإعلام Typescript عنها. ربما لأنه مضاد للنمط ويجب أن أتجاوزه ...

لقد تلقينا بعض الطلبات (على سبيل المثال # 2357) لتوسيع typeof لدعم الوحدات الخارجية ، ولكن حتى الآن لم يكن هناك الكثير من الطلب على هذه الميزة.

بشكل عام ، تتم كتابة البرامج إما بدون وحدات خارجية أو بشكل حصري مع وحدات خارجية. بخلاف جزء التمهيد من تطبيق مستعرض AMD ، لا توجد بالفعل بيئة تنفيذ حيث يكون النموذج المختلط ممكنًا. لذا نعم ، إنه في الغالب نمط مضاد.

شكرا لأخذك كل الوقت لمزاحتي على هذا! لقد بدأت للتو في استكشاف الوحدات الخارجية (للعب مع أطر عمل Angular2 و Aurelia القادمة). يبدو أن مشكلات مثل # 17 و # 2338 و # 2839 هي أكثر مما أبحث عنه في النهاية. آمل أن أتوصل إلى تعليقات أكثر وضوحًا بينما أتعمق أكثر في مشروعي الحالي.

هل ما زال هذا غير ممكن؟ أحاول استخدام TypeScript مع VueJS وسأكون ممتنًا للغاية إذا كان بإمكاني استيراد بعض الأشياء إلى مساحة الاسم العالمية بحيث يمكن لجميع المكونات استخدامها دون الحاجة إلى استيراد هذه الأشياء. هل تم إحراز أي تقدم أو اختراقات لإنجاح هذا العمل؟

تضمين التغريدة

لقد وجدت طريقة تعمل على ما يبدو مع 2.xx من النوع المطبوع على ما يبدو. في حالتي ، أريد عرض مكتبة ramda على أنها عالمية R .

  1. npm install ramda @types/ramda
  2. إنشاء ملف typings/ramda.d.ts
  3. أضف المجلد typings الذي تم إنشاؤه حديثًا إلى الملفات المضمنة في .tsconfig.json:
"include": [
    "typings/**/*",
     ...
]
  1. أضف السحر إلى typings/ramda.d.ts :
import * as _R from 'ramda';

export as namespace R;
export = _R; 

الآن تفترض جميع ملفات ts في مشروعي أن هناك ملفًا عالميًا مكتوبًا R بدون أن أقوم بأي عمليات استيراد أخرى أو أي شيء في هذه الملفات.

geekflyer عندما أحاول القيام بذلك باستخدام الكود التالي في types/vue.d.ts :

import * as V from 'vue'

export as namespace Vue
export = V

أتلقى الخطأ التالي عندما أحاول استخدام هذا Vue مكان ما:

error TS2686: 'Vue' refers to a UMD global, but the current file is a module. Consider adding an import instead.

هل حصلت على هذا الخطأ أيضًا في مرحلة ما؟ إذا كان الأمر كذلك ، فماذا فعلت حيال ذلك؟

تعديل

إذا لم تحصل على هذا الخطأ ولم تكن متأكدًا من سبب ظهور هذا الخطأ ، فربما تكون على استعداد لإظهار tsconfig.json بالكامل وربما حتى تهيئة حزمة الويب الخاصة بك؟

مرحبًا Evertt بالفعل أنا أتلقى هذا الخطأ الآن أيضًا. في البداية ، لم يكن كود المصدر الخاص بي يستخدم بناء جملة الوحدة النمطية ES6 ولكن بمجرد إعادة هيكلة بعض الملفات إلى هذا النحو ، حصلت على نفس الخطأ. قمت ببعض الأبحاث وما نجح معي الآن هو عندما أنشأت ملفًا ثانيًا globals.d.ts وأضعه أيضًا في مجلد الكتابة:

import * as _R from 'ramda';
import * as _mobx from 'mobx';

declare global {
  const R: typeof _R;
  const mobx: typeof _mobx;
}

في الواقع ، يبدو أن هذا الملف وحده "يلبي" المترجم المطبوع عليه ، لذا من الناحية النظرية لن تحتاج إلى الملفات الأخرى التي ذكرتها سابقًا. ومع ذلك ، في حالتي الخاصة (أنا أستخدم WebStorm) عندما يكون لدي ملف globals.d.ts فقط ، كان IDE الخاص بي يضغط علي باستمرار لاستيراد الوحدات ، كما أن الإكمالات على تلك الكرة الأرضية كانت غير مكتملة. لذلك احتفظت الآن بشكل أساسي بكلا الملفين في دليل الكتابة الذي يلبي الكتابة المطبوعة و IDE. ليس لطيفًا حقًا ، ولكن بالنسبة لعدد قليل من الكرات الأرضية التي يستخدمها المرء عادةً ، أعتقد أنه من الجيد الاحتفاظ بهذه الملفات.

هذا هو tsconfig.json الخاص بي للمرجع:

{
  "compilerOptions": {
    "target": "ES5",
    "module": "amd",
    "moduleResolution": "node",
    "experimentalDecorators": true,
    "lib": [
      "ES6",
      "DOM",
      "ScriptHost"
    ],
    "sourceMap": true,
    "strictNullChecks": true
  },
  "include": [
    "types/**/*",
    "src/**/*"
  ]
}

أنا لا أستخدم حزمة الويب أو أي شيء لحزم. أقوم فقط بترجمة الملفات الفردية وتحميلها عبر نظام الوحدة النمطية https://github.com/SAP/openui5 (الذي يشبه AMD) وقم بتجميعها للإنتاج فقط.

نسخة مطبوعة هي: 2.2.1

امل ان يساعد.

geekflyer شكرا لك أن ذلك كان مفيدا للغاية

هل كانت هذه الصفحة مفيدة؟
0 / 5 - 0 التقييمات