module-federation · ScriptedAlchemy · Jun 22, 2020 · Jun 22, 2020 · Jun 22, 2020 · Jun 22, 2020
diff --git a/README.md b/README.md
@@ -17,8 +17,9 @@ If you need **support**, consider looking at my sponsor profile [https://github.
 **Medium post** **Original Webpack Issue** [https://link.medium.com/xzFgBBtAx6](https://module-federation.github.io/redirect?utm_source=ModuleFederationExamples&utm_campaign=game_changer_medium_post&utm_medium=https://link.medium.com/xzFgBBtAx6)
 
 # Check out our book
+
 | <a href="https://module-federation.myshopify.com/products/practical-module-federation" target="_blank"><img src="./docs/MFCover.png" alt='Practical Module Federation Book' width="95%"/></a> | <a href="https://module-federation.myshopify.com/products/practical-module-federation" target="_blank">We will be actively updating this book over the next year as we learn more about best practices and what issues people are running into with Module Federation, as well as with every release of Webpack as it moves towards a release candidate and release. So with your one purchase you are buying a whole year of updates.</a> |
-|------------------------------------------------------------------------------------|---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
+| --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
 
 
 # Examples
@@ -28,6 +29,7 @@ If you need **support**, consider looking at my sponsor profile [https://github.
 > - ⚠️: In Progress/Incomplete
 > - 🔒: Depends on proprietary code that isn't free.
 
+- [x] [Advanced API](./advanced-api) &mdash; showcasing advanced API use, also seen in other examples
 - [x] [Basic Host-Remote](./basic-host-remote/README.md) &mdash; App 1 consumes remote components from App2.
 - [x] [Bi-Directional Hosts](./bi-directional/README.md) &mdash; App1 consumes App2 components; App2 consumes App1 components.
 - [x] [Self-Healing](./self-healing/README.md) &mdash; Fallback to remote apps vendors if a dependency fails to load.
@@ -36,14 +38,15 @@ If you need **support**, consider looking at my sponsor profile [https://github.
 - [x] [Dynamic System Host](./dynamic-system-host/README.md) &mdash; Swap between remotes at runtime.
 - [x] [Redux Reducer Injection](./redux-reducer-injection.md) &mdash; Dynamically inject reducers to host store at runtime.
 - [x] [Shared Routes](./shared-routes2) &mdash; Compose federated routes for a seamless user experience.
-- [x] [Nested Components](./nested/README.md) &mdash; Nested remote components.[link to Google!](http://google.com)
+- [x] [Nested Components](./nested/README.md) &mdash; Nested remote components.
 - [x] [Share Context Provider](./shared-context/README.md) &mdash; App1 and App2 with shared Context Provider.
-- [x] 🔒 [Streaming Federated Code ](./streamed-federation/README.md) &mdash; App1 and federated-middleware deploy to s3. App1 then stream's federated code directly from S3
-- [x] Non-UI Modul
-- [x] Routing
+- [x] [Federation Dashboard Example](./dashboard-example/README.md) &mdash; Single example implementing [Module Federation Dashboard](https://www.npmjs.com/package/@module-federation/dashboard-plugin)
+- [x] 🔒 [Streaming Federated Code](./streamed-federation/README.md) &mdash; App1 and federated-middleware deploy to s3. App1 then stream's federated code directly from S3
+- [x] Non-UI Module
+- [x] [Routing](./shared-routing/README.md) &mdash; An example of sharing router context. Also worth looking at - [Routing 2](./shared-routes2/README.md)
 - [x] [Version Discrepancy](./version-discrepancy/README.md) &mdash; Federated apps depending on different versions of a dependency without side-effects.
 - [x] [TypeScript](./typescript/README.md) &mdash; Simple host/remote example using TypeScript.
-- [x] ⚠️ [Angular Universal](./angular-universal-ssr/README.md) &mdash; Remote and Host app with SSR, lazy modules and components.
+- [x] ⚠️ [Angular Universal](./angular-universal-ssr/README.md) &mdash; Remote and Host app with SSR, lazy modules and components. (Not working with WP beta.18)
 - [ ] NextJS
 
 # Notes

diff --git a/advanced-api/automatic-vendor-sharing/app1/package.json b/advanced-api/automatic-vendor-sharing/app1/package.json
@@ -8,7 +8,7 @@
     "babel-loader": "8.1.0",
     "html-webpack-plugin": "git://github.com/ScriptedAlchemy/html-webpack-plugin#master",
     "serve": "11.3.0",
-    "webpack": "^5.0.0-beta.17",
+    "webpack": "^5.0.0-beta.18",
     "webpack-cli": "3.3.11",
     "webpack-dev-server": "3.11.0"
   },

diff --git a/advanced-api/automatic-vendor-sharing/app2/package.json b/advanced-api/automatic-vendor-sharing/app2/package.json
@@ -8,7 +8,7 @@
     "babel-loader": "8.1.0",
     "html-webpack-plugin": "git://github.com/ScriptedAlchemy/html-webpack-plugin#master",
     "serve": "11.3.0",
-    "webpack": "^5.0.0-beta.17",
+    "webpack": "^5.0.0-beta.18",
     "webpack-cli": "3.3.11",
     "webpack-dev-server": "3.11.0"
   },

diff --git a/advanced-api/dynamic-remotes/app1/package.json b/advanced-api/dynamic-remotes/app1/package.json
@@ -8,7 +8,7 @@
     "babel-loader": "8.1.0",
     "html-webpack-plugin": "git://github.com/ScriptedAlchemy/html-webpack-plugin#master",
     "serve": "11.3.0",
-    "webpack": "^5.0.0-beta.17",
+    "webpack": "^5.0.0-beta.18",
     "webpack-cli": "3.3.11",
     "webpack-dev-server": "3.11.0"
   },

diff --git a/advanced-api/dynamic-remotes/app2/package.json b/advanced-api/dynamic-remotes/app2/package.json
@@ -8,7 +8,7 @@
     "babel-loader": "8.1.0",
     "html-webpack-plugin": "git://github.com/ScriptedAlchemy/html-webpack-plugin#master",
     "serve": "11.3.0",
-    "webpack": "^5.0.0-beta.17",
+    "webpack": "^5.0.0-beta.18",
     "webpack-cli": "3.3.11",
     "webpack-dev-server": "3.11.0"
   },

diff --git a/advanced-api/dynamic-remotes/app3/package.json b/advanced-api/dynamic-remotes/app3/package.json
@@ -8,7 +8,7 @@
     "babel-loader": "8.1.0",
     "html-webpack-plugin": "git://github.com/ScriptedAlchemy/html-webpack-plugin#master",
     "serve": "11.3.0",
-    "webpack": "^5.0.0-beta.17",
+    "webpack": "^5.0.0-beta.18",
     "webpack-cli": "3.3.11",
     "webpack-dev-server": "3.11.0"
   },

diff --git a/basic-host-remote/app1/package.json b/basic-host-remote/app1/package.json
@@ -9,7 +9,7 @@
     "bundle-loader": "^0.5.6",
     "html-webpack-plugin": "git://github.com/ScriptedAlchemy/html-webpack-plugin#master",
     "serve": "11.3.1",
-    "webpack": "5.0.0-beta.17",
+    "webpack": "5.0.0-beta.18",
     "webpack-cli": "3.3.11",
     "webpack-dev-server": "3.11.0"
   },

diff --git a/basic-host-remote/app2/package.json b/basic-host-remote/app2/package.json
@@ -8,7 +8,7 @@
     "babel-loader": "8.1.0",
     "html-webpack-plugin": "git://github.com/ScriptedAlchemy/html-webpack-plugin#master",
     "serve": "11.3.1",
-    "webpack": "5.0.0-beta.17",
+    "webpack": "5.0.0-beta.18",
     "webpack-cli": "3.3.11",
     "webpack-dev-server": "3.11.0"
   },

diff --git a/basic-host-remote/yarn.lock b/basic-host-remote/yarn.lock
@@ -0,0 +1,4 @@
+# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
+# yarn lockfile v1
+
+
diff --git a/bi-directional/app1/package.json b/bi-directional/app1/package.json
@@ -8,7 +8,7 @@
     "babel-loader": "8.1.0",
     "html-webpack-plugin": "git://github.com/ScriptedAlchemy/html-webpack-plugin#master",
     "serve": "11.3.1",
-    "webpack": "5.0.0-beta.17",
+    "webpack": "5.0.0-beta.18",
     "webpack-cli": "3.3.11",
     "webpack-dev-server": "3.11.0"
   },

diff --git a/bi-directional/app2/package.json b/bi-directional/app2/package.json
@@ -8,7 +8,7 @@
     "babel-loader": "8.1.0",
     "html-webpack-plugin": "git://github.com/ScriptedAlchemy/html-webpack-plugin#master",
     "serve": "11.3.1",
-    "webpack": "5.0.0-beta.17",
+    "webpack": "5.0.0-beta.18",
     "webpack-cli": "3.3.11",
     "webpack-dev-server": "3.11.0"
   },

diff --git a/comprehensive-demo/app-01/package.json b/comprehensive-demo/app-01/package.json
@@ -13,7 +13,7 @@
     "react-dom": "^16.13.0",
     "react-router-dom": "^5.1.2",
     "serve": "^11.3.0",
-    "webpack": "5.0.0-beta.17",
+    "webpack": "5.0.0-beta.18",
     "webpack-cli": "^3.3.11"
   },
   "scripts": {

diff --git a/comprehensive-demo/app-02/package.json b/comprehensive-demo/app-02/package.json
@@ -12,7 +12,7 @@
     "react-dom": "^16.13.0",
     "react-router-dom": "^5.1.2",
     "serve": "^11.3.0",
-    "webpack": "5.0.0-beta.17",
+    "webpack": "5.0.0-beta.18",
     "webpack-cli": "^3.3.11"
   },
   "scripts": {

diff --git a/comprehensive-demo/app-03/package.json b/comprehensive-demo/app-03/package.json
@@ -11,7 +11,7 @@
     "react-dom": "^16.13.0",
     "serve": "^11.3.0",
     "styled-components": "^5.0.1",
-    "webpack": "5.0.0-beta.17",
+    "webpack": "5.0.0-beta.18",
     "webpack-cli": "^3.3.11"
   },
   "scripts": {

diff --git a/comprehensive-demo/app-04/package.json b/comprehensive-demo/app-04/package.json
@@ -10,7 +10,7 @@
     "svelte": "3.23.0",
     "svelte-loader": "2.13.6",
     "html-webpack-plugin": "git://github.com/ScriptedAlchemy/html-webpack-plugin#master",
-    "webpack": "5.0.0-beta.17",
+    "webpack": "5.0.0-beta.18",
     "webpack-cli": "3.3.11",
     "webpack-dev-server": "3.11.0",
     "serve": "11.3.1"

diff --git a/comprehensive-demo/app-05/package.json b/comprehensive-demo/app-05/package.json
@@ -16,7 +16,7 @@
     "ts-loader": "5.4.5",
     "typescript": "3.9.3",
     "html-webpack-plugin": "git://github.com/ScriptedAlchemy/html-webpack-plugin#master",
-    "webpack": "5.0.0-beta.17",
+    "webpack": "5.0.0-beta.18",
     "webpack-cli": "3.3.11",
     "webpack-dev-server": "3.11.0",
     "serve": "11.3.1"

diff --git a/dashboard-example/README.md b/dashboard-example/README.md
@@ -1,6 +1,8 @@
-# Bi-Directional Hosts Example
+# Dashboard Edample
 
-This example demos bi-directional hosts each with their own remote `Button` components.
+This example shows the dashboard running in read-only mode.
+
+Please follow instructions here to boot and run the dashboard: https://www.npmjs.com/package/@module-federation/dashboard-plugin
 
 - `app1` exposes a red `<button>App 1 Button</button>` component.
 - `app2` exposes a blue `<button>App 2 Button</button>` component.

diff --git a/dashboard-example/app1/package.json b/dashboard-example/app1/package.json
@@ -8,10 +8,10 @@
     "babel-loader": "8.1.0",
     "html-webpack-plugin": "git://github.com/ScriptedAlchemy/html-webpack-plugin#master",
     "serve": "11.3.1",
-    "webpack": "5.0.0-beta.17",
+    "webpack": "5.0.0-beta.18",
     "webpack-cli": "3.3.11",
     "webpack-dev-server": "3.11.0",
-    "@module-federation/propriatery-tools": "git+ssh://git@github.com:module-federation/proprietary-tools.git"
+    "@module-federation/dashboard-plugin": "@module-federation/dashboard-plugin"
   },
   "scripts": {
     "start": "node --inspect ../../node_modules/webpack-dev-server/bin/webpack-dev-server.js",

diff --git a/dashboard-example/app1/webpack.config.js b/dashboard-example/app1/webpack.config.js
@@ -1,5 +1,5 @@
 const HtmlWebpackPlugin = require("html-webpack-plugin");
-const BuildHashPlugin = require("@module-federation/propriatery-tools/packages/dashboard-plugin");
+const DashboardPlugin = require("@module-federation/dashboard-plugin");
 const ModuleFederationPlugin = require("webpack").container
   .ModuleFederationPlugin;
 const path = require("path");
@@ -43,10 +43,15 @@ module.exports = {
     new HtmlWebpackPlugin({
       template: "./public/index.html",
     }),
-    new BuildHashPlugin({
+    new DashboardPlugin({
       filename: "dashboard.json",
-      reportFunction: (data) => {
-        console.log("afterDone", data);
+      dashboardURL: "http://localhost:3000/api/update",
+      metadata: {
+        source: {
+          url:
+            "https://github.com/module-federation/module-federation-examples/tree/master/dashboard-example/app1",
+        },
+        remote: "http://localhost:3001/remoteEntry.js",
       },
     }),
   ],

diff --git a/dashboard-example/app2/package.json b/dashboard-example/app2/package.json
@@ -8,10 +8,10 @@
     "babel-loader": "8.1.0",
     "html-webpack-plugin": "git://github.com/ScriptedAlchemy/html-webpack-plugin#master",
     "serve": "11.3.1",
-    "webpack": "5.0.0-beta.17",
+    "webpack": "5.0.0-beta.18",
     "webpack-cli": "3.3.11",
     "webpack-dev-server": "3.11.0",
-    "@module-federation/propriatery-tools": "git+ssh://git@github.com:module-federation/proprietary-tools.git"
+    "@module-federation/dashboard-plugin": "@module-federation/dashboard-plugin"
   },
   "scripts": {
     "start": "webpack-dev-server",

diff --git a/dashboard-example/app2/webpack.config.js b/dashboard-example/app2/webpack.config.js
@@ -1,8 +1,7 @@
 const HtmlWebpackPlugin = require("html-webpack-plugin");
-const BuildHashPlugin = require("@module-federation/propriatery-tools/packages/dashboard-plugin");
+const DashboardPlugin = require("@module-federation/dashboard-plugin");
+const { ModuleFederationPlugin } = require("webpack").container;
 
-const ModuleFederationPlugin = require("webpack").container
-  .ModuleFederationPlugin;
 const path = require("path");
 const sharedReduce = ["react", "react-dom"].reduce((shared, pkg) => {
   Object.assign(shared, { [`${pkg}-${require(pkg).version}`]: pkg });
@@ -46,10 +45,15 @@ module.exports = {
     new HtmlWebpackPlugin({
       template: "./public/index.html",
     }),
-    new BuildHashPlugin({
+    new DashboardPlugin({
       filename: "dashboard.json",
-      reportFunction: (data) => {
-        console.log("afterDone", data);
+      dashboardURL: "http://localhost:3000/api/update",
+      metadata: {
+        source: {
+          url:
+            "https://github.com/module-federation/module-federation-examples/tree/master/dashboard-example/app2",
+        },
+        remote: "http://localhost:3002/remoteEntry.js",
       },
     }),
   ],

diff --git a/dynamic-system-host/app1/package.json b/dynamic-system-host/app1/package.json
@@ -8,7 +8,7 @@
     "babel-loader": "8.1.0",
     "html-webpack-plugin": "git://github.com/ScriptedAlchemy/html-webpack-plugin#master",
     "serve": "11.3.1",
-    "webpack": "5.0.0-beta.17",
+    "webpack": "5.0.0-beta.18",
     "webpack-cli": "3.3.11",
     "webpack-dev-server": "3.11.0"
   },

diff --git a/dynamic-system-host/app2/package.json b/dynamic-system-host/app2/package.json
@@ -8,7 +8,7 @@
     "babel-loader": "8.1.0",
     "html-webpack-plugin": "git://github.com/ScriptedAlchemy/html-webpack-plugin#master",
     "serve": "11.3.1",
-    "webpack": "5.0.0-beta.17",
+    "webpack": "5.0.0-beta.18",
     "webpack-cli": "3.3.11",
     "webpack-dev-server": "3.11.0"
   },

diff --git a/dynamic-system-host/app3/package.json b/dynamic-system-host/app3/package.json
@@ -8,7 +8,7 @@
     "babel-loader": "8.1.0",
     "html-webpack-plugin": "git://github.com/ScriptedAlchemy/html-webpack-plugin#master",
     "serve": "11.3.1",
-    "webpack": "5.0.0-beta.17",
+    "webpack": "5.0.0-beta.18",
     "webpack-cli": "3.3.11",
     "webpack-dev-server": "3.11.0"
   },

diff --git a/nested/app1/package.json b/nested/app1/package.json
@@ -8,7 +8,7 @@
     "babel-loader": "8.1.0",
     "html-webpack-plugin": "git://github.com/ScriptedAlchemy/html-webpack-plugin#master",
     "serve": "11.3.1",
-    "webpack": "5.0.0-beta.17",
+    "webpack": "5.0.0-beta.18",
     "webpack-cli": "3.3.11",
     "webpack-dev-server": "3.11.0"
   },

diff --git a/nested/app2/package.json b/nested/app2/package.json
@@ -8,7 +8,7 @@
     "babel-loader": "8.1.0",
     "html-webpack-plugin": "git://github.com/ScriptedAlchemy/html-webpack-plugin#master",
     "serve": "11.3.1",
-    "webpack": "5.0.0-beta.17",
+    "webpack": "5.0.0-beta.18",
     "webpack-cli": "3.3.11",
     "webpack-dev-server": "3.11.0"
   },

diff --git a/nested/app3/package.json b/nested/app3/package.json
@@ -8,7 +8,7 @@
     "babel-loader": "8.1.0",
     "html-webpack-plugin": "git://github.com/ScriptedAlchemy/html-webpack-plugin#master",
     "serve": "11.3.1",
-    "webpack": "5.0.0-beta.17",
+    "webpack": "5.0.0-beta.18",
     "webpack-cli": "3.3.11",
     "webpack-dev-server": "3.11.0"
   },

diff --git a/package.json b/package.json
@@ -29,11 +29,7 @@
       "**/svelte",
       "**/svelte/**",
       "**/svelte-loader",
-      "**/svelte-loader/**",
-      "**/webpack",
-      "**/webpack/**",
-      "**/enhanced-resolve",
-      "**/enhanced-resolve/**"
+      "**/svelte-loader/**"
     ]
   },
   "devDependencies": {

diff --git a/redux-reducer-injection/app1/package.json b/redux-reducer-injection/app1/package.json
@@ -14,7 +14,7 @@
     "react-router-dom": "^5.1.2",
     "redux": "^4.0.5",
     "serve": "^11.3.0",
-    "webpack": "5.0.0-beta.17",
+    "webpack": "5.0.0-beta.18",
     "webpack-cli": "^3.3.11"
   },
   "scripts": {

diff --git a/redux-reducer-injection/app2/package.json b/redux-reducer-injection/app2/package.json
@@ -12,7 +12,7 @@
     "react-dom": "^16.13.0",
     "react-redux": "^7.2.0",
     "serve": "^11.3.0",
-    "webpack": "5.0.0-beta.17",
+    "webpack": "5.0.0-beta.18",
     "webpack-cli": "^3.3.11"
   },
   "scripts": {

diff --git a/self-healing/app1/package.json b/self-healing/app1/package.json
@@ -8,7 +8,7 @@
     "babel-loader": "8.1.0",
     "html-webpack-plugin": "git://github.com/ScriptedAlchemy/html-webpack-plugin#master",
     "serve": "11.3.1",
-    "webpack": "5.0.0-beta.17",
+    "webpack": "5.0.0-beta.18",
     "webpack-cli": "3.3.11",
     "webpack-dev-server": "3.11.0"
   },

diff --git a/self-healing/app2/package.json b/self-healing/app2/package.json
@@ -8,7 +8,7 @@
     "babel-loader": "8.1.0",
     "html-webpack-plugin": "git://github.com/ScriptedAlchemy/html-webpack-plugin#master",
     "serve": "11.3.1",
-    "webpack": "5.0.0-beta.17",
+    "webpack": "5.0.0-beta.18",
     "webpack-cli": "3.3.11",
     "webpack-dev-server": "3.11.0"
   },

diff --git a/server-side-rendering/website1/package.json b/server-side-rendering/website1/package.json
@@ -83,7 +83,7 @@
     "sass-loader": "8.0.2",
     "style-loader": "1.2.1",
     "url-loader": "4.1.0",
-    "webpack": "5.0.0-beta.17",
+    "webpack": "5.0.0-beta.18",
     "webpack-cli": "^3.3.11",
     "webpack-dev-middleware": "4.0.0-rc.1",
     "webpack-hot-middleware": "2.25.0",

diff --git a/server-side-rendering/website2/package.json b/server-side-rendering/website2/package.json
@@ -85,7 +85,7 @@
     "sass-loader": "8.0.2",
     "style-loader": "1.2.1",
     "url-loader": "4.1.0",
-    "webpack": "5.0.0-beta.17",
+    "webpack": "5.0.0-beta.18",
     "webpack-cli": "3.3.11",
     "webpack-dev-middleware": "4.0.0-rc.1",
     "webpack-hot-middleware": "2.25.0",

diff --git a/shared-context/app1/package.json b/shared-context/app1/package.json
@@ -8,7 +8,7 @@
     "babel-loader": "8.1.0",
     "html-webpack-plugin": "git://github.com/ScriptedAlchemy/html-webpack-plugin#master",
     "serve": "11.3.1",
-    "webpack": "5.0.0-beta.17",
+    "webpack": "5.0.0-beta.18",
     "webpack-cli": "3.3.11",
     "webpack-dev-server": "3.11.0"
   },
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,4 @@
		# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
		# yarn lockfile v1