microsoft / microsoft/TypeScript

Cannot use type side of a namespace in JsDoc after `declare global ...` workaround for UMD globals

Aperta
#26,486 1 commento 1 reazione 0 assegnatari Vedi su GitHub

Nessuno ha ancora preso questa issue.

Bug Domain: JSDoc
Lingua principale
Go
Stelle
111k
Fork
14.3k
Merge medio
2g 4h
PR unite (30g)
132

Descrizione

I hit this while writing an electron app using checkJs where you can both require code in (thus making your file a module), and there may also be script tags loading code in the HTML for the app. For example, by main page has the below as it is using D3. Thus the 'd3' object is available globally.

    <script src="node_modules/d3/dist/d3.js"></script>
    <script src="./app.js"></script>

Trying to use the global D3 in my app.js however results in the error 'd3' refers to a UMD global, but the current file is a module..., so I've added the common workaround below to avoid this via a .d.ts file.

import {default as _d3} from 'd3';


declare global {
    // Make the global d3 from directly including the bundle via a script tag available as a global
    const d3: typeof _d3;
}

When the above .d.ts code is present (and only when), JSDoc gives an error on trying to use types from the namespace, i.e. the below code

/** @type {d3.DefaultArcObject} */
var x;

Results in the error Namespace '"./@types/d3/index".d3' has no exported member 'DefaultArcObject'. Yet the below TypeScript continues to work fine:

var x: d3.DefaultArcObject;

The below also continues to work fine in JavaScript, but is kind of ugly and a pain to have to repeat (especially if you need to use a lot of type arguments)

/** @type {import('d3').DefaultArcObject} */
var x;

Personally I'd rather not have to do the .d.ts workaround at all and just be able to use the d3 global in my modules (see the highly controversial #10178). That not being the case, JsDoc should be able to access the types still with the workaround in place.

Guida per i contributori

Apri la guida per i contributori

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Direzione di ricerca

Inizia riproducendo il caso checkJs usando la dichiarazione globale in .d.ts, app.js e il riferimento JSDoc a d3.DefaultArcObject. Confronta la ricerca JSDoc che fallisce con l’annotazione TypeScript funzionante e la forma import('d3'). Il lavoro è terminato quando il tipo dello spazio dei nomi viene risolto tramite la dichiarazione globale senza l’errore segnalato.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Valutazione

Stack tecnologico
d3, electron, javascript, typescript
Ambito
compilers, developer-experience
Tipo di issue
Bug
Difficoltà
4/5
Tempo stimato
3-5 giorni
Stato di attività
Ferma
Chiarezza
Abbastanza chiara
Idoneità per principianti
25/100

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.