Webpack5 module federation

babel.config.js

@@ -1,12 +1 @@
-module.exports = {
-    presets: [
-        [
-            "@babel/preset-env",
-            {
-                useBuiltIns: "entry",
-                corejs: 3,
-            },
-        ],
-    ],
-    plugins: ["@babel/plugin-proposal-optional-chaining"],
-};
+module.exports = require("@patternslib/patternslib/babel.config.js");

index.js

@@ -0,0 +1,3 @@
+// Webpack entry point for module federation.
+__webpack_public_path__ = document.currentScript.src + "/../";
+import("./bundle-config");

package.json

@@ -5,46 +5,43 @@
     "license": "MIT",
     "main": "./src/tinymce.js",
     "dependencies": {
-        "@patternslib/patternslib": "^5.1.2",
+        "@patternslib/patternslib": "git+https://github.com/Patternslib/Patterns.git#webpack5",
         "tinymce": "^5.10.0"
     },
     "devDependencies": {
         "@babel/core": "^7.15.8",
         "@babel/eslint-parser": "^7.15.8",
         "@babel/plugin-proposal-optional-chaining": "^7.14.5",
         "@babel/preset-env": "^7.15.8",
-        "@commitlint/cli": "^12.1.4",
-        "@commitlint/config-conventional": "^12.1.4",
+        "@commitlint/cli": "^13.2.1",
+        "@commitlint/config-conventional": "^13.2.0",
         "@release-it/conventional-changelog": "^3.3.0",
         "@testing-library/jest-dom": "^5.14.1",
         "babel-loader": "^8.2.3",
-        "clean-webpack-plugin": "^3.0.0",
-        "copy-webpack-plugin": "^6.4.1",
+        "copy-webpack-plugin": "^9.0.1",
         "core-js": "3.19.0",
-        "css-loader": "^5.2.6",
-        "duplicate-package-checker-webpack-plugin": "^3.0.0",
-        "eslint": "^7.28.0",
+        "css-loader": "^6.3.0",
+        "eslint": "^8.1.0",
         "eslint-config-prettier": "^8.3.0",
-        "expose-loader": "^1.0.3",
-        "file-loader": "^6.2.0",
-        "husky": "^6.0.0",
+        "expose-loader": "^3.0.0",
+        "husky": "^7.0.4",
         "identity-obj-proxy": "^3.0.0",
-        "imports-loader": "^1.2.0",
+        "imports-loader": "^3.1.0",
+        "inspectpack": "^4.7.1",
         "jest": "^27.3.1",
-        "jest-watch-typeahead": "^0.6.4",
+        "jest-watch-typeahead": "^1.0.0",
         "prettier": "^2.4.1",
-        "raw-loader": "^4.0.1",
         "regenerator-runtime": "^0.13.9",
         "release-it": "^14.11.6",
-        "sass": "^1.43.3",
-        "sass-loader": "^10.1.1",
-        "style-loader": "^2.0.0",
-        "svg-inline-loader": "^0.8.2",
-        "terser-webpack-plugin": "^4.2.3",
-        "webpack": "^4.43.0",
-        "webpack-bundle-analyzer": "^3.9.0",
+        "sass": "^1.43.2",
+        "sass-loader": "^12.1.0",
+        "style-loader": "^3.3.0",
+        "terser-webpack-plugin": "^5.2.4",
+        "timezone-mock": "^1.2.2",
+        "webpack": "^5.53.0",
+        "webpack-bundle-analyzer": "^4.4.2",
         "webpack-cli": "^4.9.1",
-        "webpack-dev-server": "^3.11.2",
+        "webpack-dev-server": "^4.2.1",
         "webpack-modernizr-loader": "^5.0.0",
         "whybundled": "^2.0.0",
         "yarn": "^1.22.17"

webpack.config.js

@@ -1,14 +1,36 @@
 process.traceDeprecation = true;
 const path = require("path");
 const patternslib_config = require("@patternslib/patternslib/webpack/webpack.config.js");
+const { ModuleFederationPlugin } = require("webpack").container;
 
 module.exports = async (env, argv) => {
-    const config = patternslib_config(env, argv);
-
-    config.entry = {
-        bundle: path.resolve(__dirname, "bundle-config.js"),
+    let config = {
+        entry: {
+            bundle: path.resolve(__dirname, "index.js"),
+        },
     };
+
+    config = patternslib_config(env, argv, config);
     config.output.path = path.resolve(__dirname, "dist/");
 
+    config.plugins.push(
+        new ModuleFederationPlugin({
+            shared: {
+                "@patternslib/patternslib": {
+                    singleton: true,
+                },
+                "jquery": {
+                    requiredVersion: dependencies.jquery,
+                    singleton: true,
+                },
+                "underscore": {
+                    version: dependencies.underscore,
+                    requiredVersion: dependencies.underscore,
+                    singleton: true,
+                },
+            },
+        })
+    );
+
     return config;
 };