web-dev-qa-db-fra.com

Bootstrap 4 La définition de type TypeScript ne parvient pas à se compiler - Impossible de trouver le module 'popper.js'

J'essaie de configurer un projet TypeScript et de faire fonctionner bootstrap 4 avec Popper, jQuery et Knockout dans Visual Studio Code.

J'ai installé les définitions de type knockout, jquery et bootstrap,

npm install -–save @types/knockout
npm install -–save @types/jquery
npm install --save @types/bootstrap

référencé les fichiers JS dans une configuration require.js

declare var require: any;
require.config({
    paths: {
        "knockout": "externals/knockout-3.5.0",
        "jquery": "externals/jquery-3.3.1.min",
        "popper.js": "https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js",
        "bootstrap": "https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"
    }
})

mon tsconfig.json est-ce:

{
    "compilerOptions": {
        "baseUrl": ".",
        "paths": { 
            "*": ["types/*"] 
        },
        "outDir": "./built/",
        "sourceMap": true,
        "noImplicitAny": true,
        "module": "AMD",
        "target": "es5"
    },
    "files":[
        "src/require-config.ts",
        "src/hello.ts"
    ]
}

Je vais compiler le projet et j'obtiens l'erreur suivante:

node_modules/@types/bootstrap/index.d.ts:9:25 - error TS2307: Cannot find module 'popper.js'.

9 import * as Popper from "popper.js";
                          ~~~~~~~~~~~

Found 1 error.

The terminal process terminated with exit code: 1

Il semble que mon fichier de définition de type Bootstrap échoue à la compilation car il ne trouve pas le module popper.js.

Le module popper.js est dans mon dossier @types

node_modules
 |-@types
 |  |- bootstrap
 |     |-index.d.ts (this is failing)
 |- popper.js
    |- index.d.ts (popper.js type definition)

Comment puis-je dire au compilateur TypeScript que le fichier popper.js recherché par la définition de type bootstrap se trouve plus haut dans la hiérarchie?

Je n'ai pas pu trouver de réponses, même près de cela. Donc, soit je suis tombé sur un bogue que personne d'autre n'a rencontré (peu probable), soit étant nouveau sur TypeScript, j'ai mal configuré mon environnement et j'ai raté une étape de configuration très basique que tout le monde obtient et donc personne n'a jamais a dû demander (très probablement).

Que puis-je faire pour résoudre ce problème?

12
aszalacinski

C'est le premier résultat qui m'est venu lorsque j'ai eu le problème.

Ce commentaire Github m'a aidé.

Cette bibliothèque nécessite une bibliothèque DOM (environnement de navigateur)

Vous devez ajouter dom ainsi que 'es2017' à compilerOptions.lib dans tsconfig.json.

J'ai seulement ajouté "lib": [ "DOM" ] à mon tsconfig.json pour que cela fonctionne pour moi et je cible toujours es5.

0
John Pavek