web-dev-qa-db-fra.com

Webpack: expression de la dépendance d'un module

J'essaie de require le module bootstrap-webpack dans mon application webpackée.

Il semble avoir besoin de jQuery, car le javascript fourni lance ensuite les éléments suivants:

Erreur de référence non capturée: jQuery n'est pas défini

Comment puis-je spécifier au webpack que jQuery est une dépendance pour le module bootstrap-webpack, pour résoudre ce problème? J'ai l'impression que cela devrait être trivial, mais j'ai du mal à le comprendre.

J'ai essayé d'ajouter:

"jquery": "latest"

aux dépendances dans le bootstrap-webpack package.json, mais cela n'a pas fonctionné. documentation est incomplet, et je n'arrive pas à trouver grand-chose sur ce problème. Cela devrait être trivial, non? Aidez-moi!

25
eye_mew

Il y a deux solutions possibles:

Utilisez le plugin providePlugin : il scanne le code source pour l'identifiant donné et le remplace par une référence au module donné, tout comme il a été requis.

// webpack.config.js
module.exports = {
    ...
    plugins: [
        new webpack.ProvidePlugin({
           $: "jquery",
           jQuery: "jquery"
       })
    ]
};

Utilisez le imports-loader: Il offre la possibilité de préparer des préparations comme les instructions require().

// webpack.config.js
{
    ...
    module: {
        loaders: [
            { test: require.resolve("jquery"), loader: "imports?jQuery=jquery" }
        ]
    }
}

Dans ce cas, vous devez exécuter npm install imports-loader --save Avant.

50
Johannes Ewald

Via ce problème github .

Installez expose-loader Et ajoutez require('expose?$!expose?jQuery!jquery'); à votre point d'entrée principal juste avant d'avoir besoin de webpack-bootstrap.

Cela mettra jQuery sur la fenêtre afin que tout fichier puisse y accéder. Soyez prudent avec cette méthode, tous les fichiers auront alors accès à cette version de jQuery, qu'elle soit explicitement requise ou non.

10
Derek Dahmer