Issue 1:
Bug report

What is the current behavior?

I am building a React App on serverless framework. I use webpack to compile both client-side and server-side code with Loadable-Components to do codesplitting. Everything works fine until I try to add /* webpackPrefetch: true */ to any of the imports in my Loadables. When I do this, although everything still compiles fine, server code will hard crash when it tries to import my <App /> for the SSR.

TypeError: Cannot read property '__esModule' of undefined
at /Users/alexgawley/code/serverless/tmp/loadable-repro/.webpack/service/src/servers/static.js:29310:34
at Object.<anonymous> (/Users/alexgawley/code/serverless/tmp/loadable-repro/.webpack/service/src/servers/static.js:29312:12)
at Module._compile (internal/modules/cjs/loader.js:999:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:1027:10)
at Module.load (internal/modules/cjs/loader.js:863:32)
at Function.Module._load (internal/modules/cjs/loader.js:708:14)
at Module.require (internal/modules/cjs/loader.js:887:19)
at require (internal/modules/cjs/helpers.js:74:18)
at /Users/alexgawley/code/serverless/tmp/loadable-repro/node_modules/serverless-offline/dist/lambda/handler-runner/in-process-runner/InProcessRunner.js:157:133
at runMicrotasks (<anonymous>)
at processTicksAndRejections (internal/process/task_queues.js:97:5)
at async InProcessRunner.run (/Users/alexgawley/code/serverless/tmp/loadable-repro/node_modules/serverless-offline/dist/lambda/handler-runner/in-process-runner/InProcessRunner.js:157:9)

If I remove /* webpackPrefetch: true */ everything works fine again. I've looked at the compiled code in both cases and there seems to be an additional __webpack_require__ function call in the prefetch version of the code that takes the well-formed __webpack_exports__ and overwrites it with undefined.

With /* webpackPrefetch: true */

/******/	// module factories are used so entry inlining is disabled
/******/	// startup
/******/	// Load entry module and return exports
/******/	var __webpack_exports__ = __webpack_require__("./src/servers/static.js");
/******/	__webpack_exports__ = __webpack_require__.O(__webpack_exports__);
/******/	var __webpack_export_target__ = exports;
/******/	for(var i in __webpack_exports__) __webpack_export_target__[i] = __webpack_exports__[i];
/******/	if(__webpack_exports__.__esModule) Object.defineProperty(__webpack_export_target__, "__esModule", { value: true });
/******/
/******/ })()

Without /* webpackPrefetch: true */

/******/	// module factories are used so entry inlining is disabled
/******/	// startup
/******/	// Load entry module and return exports
/******/	var __webpack_exports__ = __webpack_require__("./src/servers/static.js");
/******/	var __webpack_export_target__ = exports;
/******/	for(var i in __webpack_exports__) __webpack_export_target__[i] = __webpack_exports__[i];
/******/	if(__webpack_exports__.__esModule) Object.defineProperty(__webpack_export_target__, "__esModule", { value: true });
/******/
/******/ })()

Here's the definition of .O

(() => {
/******/	var deferred = [];
/******/	__webpack_require__.O = (result, chunkIds, fn, priority) => {
/******/	if(chunkIds) {
/******/	priority = priority || 0;
/******/	for(var i = deferred.length; i > 0 && deferred[i - 1][2] > priority; i--) deferred[i] = deferred[i - 1];
/******/	deferred[i] = [chunkIds, fn, priority];
/******/	return;
/******/	}
/******/	var notFulfilled = Infinity;
/******/	for (var i = 0; i < deferred.length; i++) {
/******/	var [chunkIds, fn, priority] = deferred[i];
/******/	var fulfilled = true;
/******/	for (var j = 0; j < chunkIds.length; j++) {
/******/	if ((priority & 1 === 0 || notFulfilled >= priority) && Object.keys(__webpack_require__.O).every((key) => (__webpack_require__.O[key](chunkIds[j])))) {
/******/	chunkIds.splice(j--, 1);
/******/	} else {
/******/	fulfilled = false;
/******/	if(priority < notFulfilled) notFulfilled = priority;
/******/	}
/******/	}
/******/	if(fulfilled) {
/******/	deferred.splice(i--, 1)
/******/	result = fn();
/******/	}
/******/	}
/******/	return result;
/******/	};
/******/	})();

If the current behavior is a bug, please provide the steps to reproduce.

git clone https://github.com/agawley/loadable-repro
npm i
npm run offline

load http://localhost:3000

Remove /* webpackPrefetch: true */ from src/client/app.js for everything to work fine.

What is the expected behavior?

I shouldn't get this error. My understanding is that adding /* webpackPrefetch: true */ should "just work".

Other relevant information:

webpack version: 5.16.0

Node.js version: 12.22.1

Operating System: macOS 10.15.7

Additional tools: See package.json in https://github.com/agawley/loadable-repro

Issue 2:
So, as you may already know, with npm@3 (on the registry now, currently in beta), peerDependencies are no longer installed for you. They act as assertions, warning you if you don't meet their requirements, but they do not break the install nor do they trigger installation of the thing mentioned.

This means that npm install -g webpack will not result in a working install out of the box as node-libs-browser won't be installed.

I'd like to work with you all to figure out what the best solution is for this. My first reaction would be to just make node-libs-browser a regular dependency. Is there a reason not to do that?