Comment importer des modules js dans un fichier TypeScript?

Question

J'ai un Rapporteur du projet qui contient un fichier de ce type:

var FriendCard = function (card) {
    var webElement = card;
    var menuButton;
    var serialNumber;

    this.getAsWebElement = function () {
        return webElement;
    };

    this.clickMenuButton = function () {
        menuButton.click();
    };

    this.setSerialNumber = function (numberOfElements) {
        serialNumber = numberOfElements + 1;
        menuButton = element(by.xpath('.//*[@id=\'mCSB_2_container\']/li[' + serialNumber + ']/ng-include/div/div[2]/i'));
    };

    this.deleteFriend = function () {
        element(by.css('[ng-click="deleteFriend(person);"]')).click();
        element(by.css('[ng-click="confirm()"]')).click();
    }
};
module.exports = FriendCard;

Chemin d'accès au fichier est

./pages/FriendCard.js

Je n'ai aucun problème avec ça importer dans un autre fichier à l'aide de require() méthode:

var FriendCard = require('./../pages/FriendCard');

Donc, j'ai décidé d'importer ce fichier dans le fichier d'enregistrement de fichier comme ça:

import {FriendCard} from './../pages/FriendCard'

Je suis l'aide de WebStorm, de sorte qu'il me dit, que (TS2305) il n'a pas exporté de membre "FriendCard'.

J'ai peut-être configurer tsconfig.fichier json en quelque sorte, mais je ne sais toujours pas comment il fonctionne. Pourriez-vous m'aider?

Answer 1

Vous pouvez importer l'ensemble du module comme suit:

 import * as FriendCard from './../pages/FriendCard';
 

Pour plus de détails, veuillez vous référer à la section modules des documents officiels Typescript.

Answer 2

Dans votre deuxième déclaration

import {FriendCard} from './../pages/FriendCard'

vous dites tapuscrit pour importer les FriendCard classe à partir du fichier". /pages/FriendCard'

Votre FriendCard fichier est de l'exportation d'une variable et que cette variable fait référence à la fonction anonyme.

Vous avez deux options ici. Si vous voulez le faire dans un typée façon, vous pouvez restructurer le module "typé" (option 1) ou vous pouvez importer de la fonction anonyme, et ajouter un d.fichier ts. Voir https://github.com/Microsoft/TypeScript/issues/3019 pour plus de détails. pourquoi vous avez besoin pour ajouter le fichier.

Option 1

Refactoriser la carte d'Ami fichier js "typé".

export class FriendCard {
webElement: any;
menuButton: any;
serialNumber: any;

constructor(card) {
    this.webElement = card;
    this.menuButton;
    this.serialNumber;
}



getAsWebElement = function () {
    return this.webElement;
};

clickMenuButton = function () {
    this.menuButton.click();
};

setSerialNumber = function (numberOfElements) {
    this.serialNumber = numberOfElements + 1;
    this.menuButton = element(by.xpath('.//*[@id=\'mCSB_2_container\']/li[' + serialNumber + ']/ng-include/div/div[2]/i'));
};

deleteFriend = function () {
    element(by.css('[ng-click="deleteFriend(person);"]')).click();
    element(by.css('[ng-click="confirm()"]')).click();
}
};

Option 2

Vous pouvez importer de la fonction anonyme

 import * as FriendCard from module("./FriendCardJs");

Il ya quelques options pour une.ts fichier de définition. Cette réponse semble être la plus complète: Comment voulez-vous produire une .d.ts "typings" fichier de définition à partir d'une bibliothèque JavaScript?