[backbone.js] Webpack ProvidePlugin vs externe?


Answers

Wenn Sie das ProvidePlugin in Kombination mit der externals ProvidePlugin , können Sie jQuery in Ihren Webpack-Modul-Closy übergeben, ohne es explizit anfordern zu müssen. Dies kann nützlich sein, um Legacy-Code mit vielen verschiedenen Dateien, die auf $ verweisen, $ .

//webpack.config.js
module.exports = {
  entry: './index.js',
  output: { 
    filename: '[name].js' 
  },
  externals: {
    jquery: 'jQuery'
  },
  plugins: [
    new webpack.ProvidePlugin({
      $: 'jquery',
    })
  ]
};

jetzt in index.js

console.log(typeof $ === 'function');

wird eine kompilierte Ausgabe haben mit etwas wie unten in das webpackBootstrap closure:

/******/ ([
/* 0 */
/***/ function(module, exports, __webpack_require__) {

    /* WEBPACK VAR INJECTION */(function($) {
        console.log(typeof $ === 'function');

    /* WEBPACK VAR INJECTION */}.call(exports, __webpack_require__(1)))

/***/ },
/* 1 */
/***/ function(module, exports, __webpack_require__) {

    module.exports = jQuery;

/***/ }
/******/ ])

Daher können Sie sehen, dass $ das globale / Fenster jQuery aus dem CDN referenziert, aber in den Abschluss übergeben wird. Ich bin mir nicht sicher, ob dies die beabsichtigte Funktionalität oder ein glücklicher Hack ist, aber es scheint gut für meinen Anwendungsfall zu funktionieren.

Question

Ich Webpack die Idee, Webpack mit Backbone.js .

Ich habe die Kurzanleitung verfolgt und habe eine allgemeine Vorstellung davon, wie Webpack funktioniert, aber ich weiß nicht, wie man die Abhängigkeitsbibliothek wie jquery / backbone / underscore laden kann.

Sollten sie extern mit <script> geladen werden oder ist das etwas was Webpack wie RequireJS's Shim handhaben kann?

Laut dem Webpack-Dokument: Shimming-Module , ProvidePlugin und externals scheinen damit verwandt zu sein (so ist bundle! Loader irgendwo), aber ich kann nicht herausfinden, wann ich welches verwenden soll.

Vielen Dank






Links