Skip to content

Commit

Permalink
Merge pull request #15608 from webpack/fix/consume-esm-bundled-library
Browse files Browse the repository at this point in the history 
consume bundled by webpack esm library
  • Loading branch information
@TheLarkInn
TheLarkInn committed Apr 12, 2023
2 parents 3b8c9c6 + c5647a9 commit c07ca8e
Show file tree
Hide file tree
Showing 5 changed files with 142 additions and 10 deletions.
37 changes: 27 additions & 10 deletions lib/CompatibilityPlugin.js
View file
Expand Up @@ -15,7 +15,7 @@ const ConstDependency = require("./dependencies/ConstDependency");
/** @typedef {import("./Compiler")} Compiler */
/** @typedef {import("./javascript/JavascriptParser")} JavascriptParser */

const nestedWebpackRequireTag = Symbol("nested __webpack_require__");
const nestedWebpackIdentifierTag = Symbol("nested webpack identifier");
const PLUGIN_NAME = "CompatibilityPlugin";

class CompatibilityPlugin {
Expand Down Expand Up @@ -82,22 +82,26 @@ class CompatibilityPlugin {
statement.id.name === "__webpack_require__"
) {
const newName = `__nested_webpack_require_${statement.range[0]}__`;
parser.tagVariable(statement.id.name, nestedWebpackRequireTag, {
name: newName,
declaration: {
updated: false,
loc: statement.id.loc,
range: statement.id.range
parser.tagVariable(
statement.id.name,
nestedWebpackIdentifierTag,
{
name: newName,
declaration: {
updated: false,
loc: statement.id.loc,
range: statement.id.range
}
}
});
);
return true;
}
});
parser.hooks.pattern
.for("__webpack_require__")
.tap(PLUGIN_NAME, pattern => {
const newName = `__nested_webpack_require_${pattern.range[0]}__`;
parser.tagVariable(pattern.name, nestedWebpackRequireTag, {
parser.tagVariable(pattern.name, nestedWebpackIdentifierTag, {
name: newName,
declaration: {
updated: false,
Expand All @@ -107,8 +111,21 @@ class CompatibilityPlugin {
});
return true;
});
parser.hooks.pattern
.for("__webpack_exports__")
.tap(PLUGIN_NAME, pattern => {
parser.tagVariable(pattern.name, nestedWebpackIdentifierTag, {
name: "__nested_webpack_exports__",
declaration: {
updated: false,
loc: pattern.loc,
range: pattern.range
}
});
return true;
});
parser.hooks.expression
.for(nestedWebpackRequireTag)
.for(nestedWebpackIdentifierTag)
.tap(PLUGIN_NAME, expr => {
const { name, declaration } = parser.currentTagData;
if (!declaration.updated) {
Expand Down
5 changes: 5 additions & 0 deletions test/configCases/output-module/reuse-webpack-esm-library/index.js
View file
@@ -0,0 +1,5 @@
import { useCall } from "./lib";

it("should compile and run", () => {
expect(useCall()).toBe(1);
});
95 changes: 95 additions & 0 deletions test/configCases/output-module/reuse-webpack-esm-library/lib.js
View file
@@ -0,0 +1,95 @@
import * as __WEBPACK_EXTERNAL_MODULE_react__ from "react";
/******/ var __webpack_modules__ = ({

/***/ "react":
/*!************************!*\
!*** external "react" ***!
\************************/
/***/ ((module) => {

var x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
var y = x => () => x
module.exports = __WEBPACK_EXTERNAL_MODULE_react__;

/***/ })

/******/ });
/************************************************************************/
/******/ // The module cache
/******/ var __webpack_module_cache__ = {};
/******/
/******/ // The require function
/******/ function __webpack_require__(moduleId) {
/******/ // Check if module is in cache
/******/ var cachedModule = __webpack_module_cache__[moduleId];
/******/ if (cachedModule !== undefined) {
/******/ return cachedModule.exports;
/******/ }
/******/ // Create a new module (and put it into the cache)
/******/ var module = __webpack_module_cache__[moduleId] = {
/******/ // no module.id needed
/******/ // no module.loaded needed
/******/ exports: {}
/******/ };
/******/
/******/ // Execute the module function
/******/ __webpack_modules__[moduleId](module, module.exports, __webpack_require__);
/******/
/******/ // Return the exports of the module
/******/ return module.exports;
/******/ }
/******/
/************************************************************************/
/******/ /* webpack/runtime/define property getters */
/******/ (() => {
/******/ // define getter functions for harmony exports
/******/ __webpack_require__.d = (exports, definition) => {
/******/ for(var key in definition) {
/******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
/******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
/******/ }
/******/ }
/******/ };
/******/ })();
/******/
/******/ /* webpack/runtime/hasOwnProperty shorthand */
/******/ (() => {
/******/ __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
/******/ })();
/******/
/******/ /* webpack/runtime/make namespace object */
/******/ (() => {
/******/ // define __esModule on exports
/******/ __webpack_require__.r = (exports) => {
/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
/******/ }
/******/ Object.defineProperty(exports, '__esModule', { value: true });
/******/ };
/******/ })();
/******/
/************************************************************************/
var __webpack_exports__ = {};
// This entry need to be wrapped in an IIFE because it need to be isolated against other modules in the chunk.
(() => {
/*!***************************!*\
!*** ./src/store/call.ts ***!
\***************************/
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "useCall": () => (/* binding */ useCall),
/* harmony export */ "withCallManager": () => (/* binding */ withCallManager)
/* harmony export */ });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");

function withCallManager() {
return react__WEBPACK_IMPORTED_MODULE_0__.createElement(1);
}
function useCall() {
return withCallManager();
}
})();

var __webpack_exports__useCall = __webpack_exports__.useCall;
var __webpack_exports__withCallManager = __webpack_exports__.withCallManager;
export { __webpack_exports__useCall as useCall, __webpack_exports__withCallManager as withCallManager };
1 change: 1 addition & 0 deletions test/configCases/output-module/reuse-webpack-esm-library/react.js
View file
@@ -0,0 +1 @@
export function createElement(a) { return a; }
14 changes: 14 additions & 0 deletions test/configCases/output-module/reuse-webpack-esm-library/webpack.config.js
View file
@@ -0,0 +1,14 @@
const path = require("path");
/** @type {import("../../../../").Configuration} */
module.exports = {
mode: "development",
devtool: "eval",
optimization: {
concatenateModules: false
},
resolve: {
alias: {
react: path.resolve(__dirname, "react")
}
}
};

0 comments on commit c07ca8e

Please sign in to comment.