I created a bundle using webpack (Nx's Webpack executor to be more exact) and it is bundling the code in a way that requires it to be explicitly called by some other script, rather than self-executing. However, when I bundle the same exact code using webpack-cli directly, it works as expected and self-executes... the way it was written.
When running the build command I'm getting variations that don't self-execute. I've played with various webpack config options such as output.module, output.chunkFormat, externalsType, etc. to try to get this this working. However, as you can see, the outputs are not self-executing:
Bad Output (Example 1)
(self["webpackChunk"] = self["webpackChunk"] || []).push([[923],{
/***/ 38147:
/***/ (() => {
console.log('TRYING ANYTHING');
/***/ })
},
/******/ __webpack_require__ => { // webpackRuntimeModules
/******/ var __webpack_exec__ = (moduleId) => (__webpack_require__(__webpack_require__.s = moduleId))
/******/ var __webpack_exports__ = (__webpack_exec__(38147));
/******/ }
]);
OR with slightly different settings
Bad Output (Example 2)
{
/***/ 38147:
/***/ (() => {
console.log('TRYING ANYTHING');
/***/ })
}
When I bundle directly using webpack-cli (webpack --config ./foo/webpack.config.js --mode production), it bundles as expected:
Good Output
/******/ (() => { // webpackBootstrap
var __webpack_exports__ = {};
console.log('TRYING ANYTHING');
/******/ })();
IMPORTANT NOTE: The build script uses a webpack.config that exports a function which then returns a merged config object. However, webpack-cli uses a webpack.config file that exports an object not a function. Not sure if this is an important distinction.
Is there some configuration option I'm missing here? Why is one bundling in a self-executing fashion and the other exports a map of function(s) that expects to be referenced directly:
{
38146: () => {
console.log('TRYING ANYTHING');
}
}
// This would need to get called somewhere... somehow?
38146();