web-dev-qa-db-fra.com

dactylographié: import export par défaut du module

J'ai le fichier de type de définition suivant:

// index.d.ts
declare module 'Transformer' {
  class EditableElement {
      constructor(target: SVGPoint);
  }
  export = EditableElement;
}

Et je veux importer EditableElement. Mais quand j'écris la ligne suivante:

import {EditableElement} from 'Transformer';

J'obtiens l'erreur suivante:

Le module "Transformer" se résout en une entité non module et ne peut pas être importé à l'aide de cette construction.

Comment importer la classe EditableElement? En fait, je veux juste utiliser cette classe. Je ne veux pas que la directive import ait un effet collatéral dans mon code. Je veux juste l'utiliser: '(

10
Cequiel

Cela tombe dans l'interopérabilité ES6/CommonJS.

Ma recommandation est de ne pas compter sur l'interopérabilité et d'utiliser l'ancienne syntaxe à la place:

const EditableElement = require('Transformer')

Si vous avez besoin de cibler es6/es2015, vous pouvez faire:

import * as EditableElement from 'Transformer'

// with `allowSyntheticDefaultImport`
import EditableElement from 'Transformer'

MISE À JOUR: avec [email protected] publié, vous pouvez maintenant faire import EditableElement from 'Transformer' directement.

Activez esModuleInterop dans votre tsconfig.json

10
unional

declare module est déconseillé à utiliser dans vos propres modules TypeScript. Vous devez utiliser export ou export default.

export class EditableElement {
      constructor(target: SVGPoint);
  }

Pour l'importation, vous pouvez utiliser import {EditableElement} from 'Transformer'; ou import * as EditableElement from 'Transformer';

1
Bogdan Surai

J'aime penser à cela de la manière suivante.

Scénario 1 - Exporter/importer des choses explicites (pas une exportation par défaut. Il en résulte la nécessité d'encapsuler votre nom d'importation avec '{}').

// Export (fileX)
export const something = 'hello world';

// Import (fileY)
import { something } from 'fileX';

Scénario 2 - Exporter/importer une valeur par défaut (il en résulte qu'il n'est pas nécessaire d'encapsuler votre nom d'importation avec '{}'). Le nom que vous choisissez, "quelque chose" ci-dessous, serait l'alias pour accéder à votre importation.

// Export (fileX)
export default 'hello world';

// Import (fileY)
import something from 'fileY';
0
Dean Martin

Avez-vous un chemin de référence comme ça?

 /// <reference path="*/**/myModules.d.ts" />
 import * as m from "SomeModule";
0
Bogdan Surai