Comment fonctionne "include" et "exclude" dans le chargeur Webpack

Mise à jour&Réponse:

Mon méprendre était:

Tous les importées/fichiers nécessaires seront transformés par chargeur.

Cependant, certains importés/fichiers requis ne sont pas nécessaires pour être transformé. Par exemple, fichiers js dans le "node_module" ont été traitées. Donc, il n'y a pas besoin d'être transformé à nouveau en Babel chargeur. C'est essentiellement pourquoi nous avons besoin de "exclure: /node_modules/" dans le chargeur.

De même, si vous savez quels sont les fichiers à être transformé par un chargeur, vous pouvez utiliser le bouton "inclure".

Tout simplement, entry.js comprendra tous les importées/fichiers requis. Mais parmi ces fichiers, seuls quelques-uns d'entre eux ont besoin d'être transformé. C'est pourquoi le "loader" introduit "inclure" et "exclure".

Je ne suis pas encore tout à fait claire sur les raisons pour lesquelles nous avons besoin d'utiliser un "include" ou "exclure" dans le chargeur de webpack.

Car l'entrée fichier js aura toujours besoin d'inclure ses importés/js fichiers de manière récursive. Tous les importées/fichiers nécessaires seront transformés par chargeur. Si c'est le cas, pourquoi avons-nous besoin de "comprendre" ou "exclure" dans le chargeur?

Un cas courant est "exclure: /node_modules/". La chose qui me confond, c'est que si l'entrée fichier js besoin de certains fichiers de la node_modules et puis on exclut les node_modules. Puis le dernier bundle fichier ne contiendra pas le pris de fichier de node_modules. Dans ce cas, la finale bundle.js ne fonctionnera pas correctement. Ai-je raté quelque chose ici?

module.exports = {
  entry: [
    './index.js'
  ],
  output: {
    path: path.join(__dirname,"public"),
    filename: 'bundle.js'
  },
  module: {
    loaders: [{
      test: /\.js$/,
      loader: 'babel',
      exclude: /node_modules/,
      query: {
          presets: ['es2015']
        }
    }]
  }
};

Grâce

Derek

source d'informationauteur derek

  1. 28

    Le problème est que, sans que exclude (ou un include) webpack serait de parcourir à travers les dépendances lorsque vous pointez à votre code et de les traiter. Même si cela pourrait fonctionner, il serait venu avec une lourde amende de la performance.

    J'ai préféré mettre en place un include moi-même (liste blanche sur la liste noire), car cela me donne plus de contrôle sur le comportement. Je include mon répertoire de l'application, puis ajouter plus d'éléments à la include fondé sur la nécessité. Cela me permet de faire des exceptions facilement et processus de bits à partir de node_modules si absolument nécessaire.

  2. 11

    Les réponses jusqu'à présent n'ont pas vraiment répondu à votre question fondamentale. Vous voulez savoir comment votre forfait app parvient toujours à fonctionner même si ses dépendances ont été "exclu".

    En fait, ceux qui "comprennent" et "exclure" propriétés dites la chargeurs si pour inclure/exclure des fichiers décrits (par exemple sur le contenu de node_modules), pas webpack lui-même.

    De sorte que le "exclu" modules vous importez à partir d' node_modules sera livré - mais ils ne sera pas transformé par babel. C'est généralement le comportement souhaité: la plupart des bibliothèques sont déjà transpiled vers ES 5.1 (ou même ES 3), et ainsi de gaspiller des cycles de PROCESSEUR analyse avec babel (par exemple) est inutile, au mieux. Au pire, comme dans le cas de gros fichier unique des bibliothèques comme jQuery, il peut jeter une erreur et apporter votre version à un arrêt complet. Si l'on exclut node_modules.