Webpack build numbering - how does it work?


I’d like to understand and know what the meaning is of the (id?) numbering when webpack is building (e.g.) an Ionic project.

When using lazy loading you’ll get the multiple .js and .js.map files in the /www/build/ folder which correspond to the modules I’m using/have in the app.

  1. Can someone explain me what the numbering, and the numbering on the second line AND the numbering for the harmany import of that module stands for??

This is for example how my 0.js looks like:


/***/ 908:
/***/ (function(module, __webpack_exports__, __webpack_require__) {

"use strict";
Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "WelcomePageModule", function() { return WelcomePageModule; });
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__angular_core__ = __webpack_require__(0);
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1_ionic_angular__ = __webpack_require__(22);
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__app_shared_module__ = __webpack_require__(909);
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__welcome__ = __webpack_require__(931);

Please take a look at line 3: 908 and line 12: 931

  1. I can see that all the modules have unique numberings, but how do they get generated? Based on what?
  2. Can we specify custom numberings (id)?

One last thing. Let’s say I have this build now with these numberings. I often see changing those numberings when re-building the same code without changing anything. Just executing ‘ionic serve’ again.

  1. Why are the numbering changing while nothing has changed?

I hope someone can explain or refer me about this topic for more intel.

Thanks in advance,

Created an copy on stackoverflow:

(question still standing)

1 Like