Ik heb een Protractor-project dat zo’n bestand bevat:

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;

Pad naar het bestand is ./pages/FriendCard.js.

Ik heb geen problemen met het importeren naar een ander bestand met behulp van require():

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

Dus ik heb besloten om dit bestand zomaar in het TypeScript-bestand te importeren:

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

Ik gebruik WebStorm. Het vertelt me ​​​​dat (TS2305) het geen geëxporteerd lid ‘FriendCard’ heeft.

Misschien moet ik het tsconfig.json-bestand op de een of andere manier configureren, maar ik weet nog steeds niet hoe het werkt. Kun je me helpen?

Antwoord 1, autoriteit 100%

Je kunt de hele module als volgt importeren:

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

Raadpleeg voor meer informatie de sectie modulesvan de officiële documenten van Typescript.

Recent bijgewerkte oplossing:we moeten de tsconfig.jsonaanpassen om JS-modules te kunnen importeren.
credits voor @paulmest, @ben-winding @crispen-gari-oplossingen hieronder.

{
  "compilerOptions": {
    "allowJs": true
  }
}

Antwoord 2, autoriteit 62%

Ik gebruik momenteel een aantal oude codebases en breng minimale TypeScript-wijzigingen aan om te zien of dit ons team helpt. Afhankelijk van hoe streng je wilt zijn met TypeScript, kan dit wel of niet een optie voor je zijn.

De handigste manier voor ons om te beginnen was om ons bestand tsconfig.jsonuit te breiden met deze eigenschap:

// tsconfig.json excerpt:
{
  ...
  "compilerOptions": {
    ...
    "allowJs": true,
    ...
  }
  ...
}

Door deze wijziging kunnen onze JS-bestanden met hints van het JSDoc-type worden gecompileerd. Ook onze IDE’s (JetBrains IDE’s en VS Code) kunnen code-aanvulling en Intellisense bieden.

Referenties:

• TypeScript – Compiler-opties
• TypeScript: TSConfig-referentie – Compileropties – allowJs

Antwoord 3, autoriteit 10%

In uw tweede verklaring

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

je vertelt typoscript om de FriendCard klassete importeren uit het bestand ‘./pages/FriendCard’

Je FriendCard-bestand exporteert een variabele en die variabele verwijst naar de anonieme functie.

Je hebt hier twee opties. Als u dit op een getypte manier wilt doen, kunt u uw module refactoren om te worden getypt (optie 1) of u kunt de anonieme functie importeren en een d.ts-bestand toevoegen. Zie https://github.com/Microsoft/TypeScript/issues/3019voor meer informatie . over waarom u het bestand moet toevoegen.

Optie 1

Refactor het Friend card js-bestand dat moet worden getypt.

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();
}
};

Optie 2

U kunt de anonieme functie importeren

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

Er zijn een paar opties voor een d.ts-bestandsdefinitie. Dit antwoord lijkt het meest compleet: Hoe maak je een .d.ts “typings”-definitiebestand van een bestaande JavaScript-bibliotheek?

Antwoord 4, autoriteit 8%

2021 oplossing

Als je nog steeds deze foutmelding krijgt:

TS7016: Could not find a declaration file for module './myjsfile'

Dan moet u mogelijk het volgende toevoegen aan tsconfig.json

{
  "compilerOptions": {
    ...
    "allowJs": true,
    "checkJs": false,
    ...
  }
}

Dit voorkomt dat typescript probeert om moduletypes toe te passen op het geïmporteerde javascript.

Antwoord 5, autoriteit 3%

Ik heb drie methoden getest om dat te doen…

Methode1:

     const FriendCard:any = require('./../pages/FriendCard')

Methode2:

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

Methode3:

als je zoiets kunt vinden in tsconfig.json:

     { "compilerOptions": { ..., "allowJs": true }

dan kun je schrijven:
import FriendCard from './../pages/FriendCard';

Antwoord 6

Ik heb al lang met dit probleem te maken, maar wat dit mijn probleem oplostGa naar de tsconfig.jsonen voeg het volgende toe onder compilerOptions

{
  "compilerOptions": {
      ...
      "allowJs": true
      ...
  }
}