Typescript: Izinkan definisi modul untuk dideklarasikan sebagai variabel global

Tidak mungkin melakukan ini karena begitu Anda menambahkan deklarasi import ke file sumber, ini dianggap sebagai modul eksternal. Adakah alasan Anda tidak menggunakan file definisi React yang menggunakan global?

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

Menurut saya seperti ini akan menyelesaikan masalah.

Saya sebenarnya mencoba react-global.d.ts juga, yang jelas menempatkan React di ruang global, tapi bagaimana saya mengganti namanya secara global dan membiarkan Typecript mengetahuinya?

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

Kasus penggunaan saya yang sebenarnya adalah dapat mengangkat modul utilitas / tipe umum ke ruang global jadi saya tidak perlu menggunakan banyak impor jalur relatif untuk mendapatkannya. Saya bisa melakukan ini di Javascript, tapi saya kesulitan bagaimana saya membiarkan compiler Typecript tahu saya telah melakukannya.

@ahejlsberg - Saya yakin Anda memiliki lebih banyak hal impor yang harus dilakukan daripada bertahan dengan renungan saya tentang kasus-kasus edge ... :)

Misalnya, Anda dapat membuat file deklarasi r.d.ts :

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

dan kemudian hanya mereferensikan file itu di mana saja. Atau bahkan lebih baik:

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

yang memungkinkan Anda juga merujuk tipe dari React as R.xxx.

Saya belum pernah melihat penggunaan typeof sebelumnya - cukup keren. Ini berfungsi dengan baik untuk modul yang sudah ditentukan dari .d.ts , tetapi saya masih tidak melihat cara untuk mengangkat modul eksternal yang ditentukan dalam Ketikan ke ruang global dan memiliki Ketik yang mengetahuinya. Mungkin karena ini anti-pola dan saya harus mengatasinya ...

Kami telah memiliki beberapa permintaan (mis. # 2357) untuk memperpanjang typeof untuk mendukung modul eksternal, tetapi sejauh ini belum ada banyak permintaan untuk fitur tersebut.

Secara umum, program ditulis tanpa modul eksternal atau secara eksklusif dengan modul eksternal. Selain bagian bootstrap dari aplikasi browser AMD, sebenarnya tidak ada lingkungan eksekusi di mana model campuran bahkan dimungkinkan. Jadi ya, ini sebagian besar merupakan anti-pola.

Terima kasih telah meluangkan waktu untuk menghibur saya tentang ini! Saya baru saja mulai menjelajahi modul eksternal (untuk bermain dengan kerangka kerja Angular2 dan Aurelia yang akan datang). Masalah seperti # 17, # 2338 dan # 2839 tampaknya lebih dari apa yang saya cari pada akhirnya. Mudah-mudahan saya akan mendapatkan umpan balik yang lebih jelas saat saya menyelami lebih dalam proyek saya saat ini.

Apakah ini masih tidak mungkin dilakukan? Saya mencoba menggunakan TypeScript dengan VueJS dan saya akan sangat menghargai jika saya dapat mengimpor beberapa hal ke dalam namespace global sehingga semua komponen dapat menggunakannya tanpa harus mengimpor hal-hal tersebut. Apakah sudah ada kemajuan atau peretasan untuk membuat ini berfungsi?

@Tokopedia

Saya menemukan cara yang tampaknya berfungsi dengan skrip ketikan 2.xx Dalam kasus saya, saya ingin mengekspos perpustakaan ramda sebagai R global.

1. npm install ramda @types/ramda
2. buat file typings/ramda.d.ts
3. tambahkan folder typings baru dibuat ke dalam include di .tsconfig.json:

"include": [
    "typings/**/*",
     ...
]

1. tambahkan keajaiban ke typings/ramda.d.ts :

import * as _R from 'ramda';

export as namespace R;
export = _R; 

Sekarang semua file ts dalam proyek saya mengasumsikan ada R global yang diketik tanpa saya melakukan impor lebih lanjut atau apa pun di file itu.

@geekflyer ketika saya mencoba melakukannya menggunakan kode berikut di types/vue.d.ts :

import * as V from 'vue'

export as namespace Vue
export = V

Saya mendapatkan kesalahan berikut setiap kali saya mencoba menggunakan Vue global di suatu tempat:

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

Apakah Anda mendapatkan kesalahan itu juga di beberapa titik? Jika ya, apa yang Anda lakukan?

edit

Jika Anda tidak mendapatkan kesalahan itu dan Anda tidak yakin mengapa saya mendapatkan kesalahan itu, apakah Anda mungkin bersedia menunjukkan kepada saya seluruh tsconfig.json Anda dan mungkin bahkan konfigurasi webpack Anda?

Hai @Evertt, saya juga mendapatkan kesalahan ini sekarang. Awalnya kode sumber saya tidak menggunakan sintaks modul ES6 tetapi begitu saya merefaktor beberapa file ke sintaks itu, saya mendapat kesalahan yang sama. Melakukan penelitian dan apa yang berhasil untuk saya sekarang adalah ketika saya membuat file kedua globals.d.ts dan memasukkannya juga ke dalam folder pengetikan:

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

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

Sebenarnya file ini sendiri tampaknya "memenuhi" compiler skrip jadi secara teori Anda tidak memerlukan file lain yang saya sebutkan sebelumnya. Namun dalam kasus khusus saya (saya menggunakan WebStorm) ketika hanya memiliki file globals.d.ts IDE saya terus-menerus melakukan ping kepada saya untuk mengimpor modul dan penyelesaian pada global tersebut tidak lengkap. Jadi pada dasarnya saya sekarang menyimpan kedua file di direktori pengetikan yang memenuhi skrip ketikan dan IDE saya. Tidak terlalu bagus, tetapi untuk beberapa global yang biasanya digunakan, saya kira tidak apa-apa untuk mempertahankan file-file itu.

Ini adalah tsconfig.json untuk referensi:

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

Saya tidak menggunakan webpack atau apa pun untuk digabungkan. Saya hanya mentranspilasi file individual dan memuatnya melalui https://github.com/SAP/openui5 sistem modul (yang mirip dengan AMD) dan memaketkannya hanya untuk produksi.

Versi typescript adalah: 2.2.1

Semoga membantu.

@geekflyer terima kasih itu sangat membantu