fix: addressing issues in prod build (#114)

Author: ScriptedAlchemy

.prettierignore

@@ -0,0 +1,4 @@
+**/dist
+**/build
+**/buildServer
+**/buildClient

shared-routing/dashboard/webpack.config.js

@@ -2,7 +2,7 @@ const HtmlWebpackPlugin = require("html-webpack-plugin");
 const ModuleFederationPlugin = require("webpack").container
   .ModuleFederationPlugin;
 const path = require("path");
-
+const deps = require("./package.json").dependen;
 module.exports = {
   entry: "./src/index",
   mode: "development",
@@ -15,6 +15,7 @@ module.exports = {
   },
   output: {
     publicPath: "http://localhost:3001/",
+    chunkFilename: "[id].[contenthash].js",
   },
   resolve: {
     alias: {
@@ -46,7 +47,19 @@ module.exports = {
       exposes: {
         "./DashboardService": "./src/DashboardService",
       },
-      shared: ["react", "react-dom", "@material-ui/core", "@material-ui/icons"],
+      shared: [
+        {
+          ...deps,
+          react: {
+            singleton: true,
+            requiredVersion: deps.react,
+          },
+          "react-dom": {
+            singleton: true,
+            requiredVersion: deps["react-dom"],
+          },
+        },
+      ],
     }),
     new HtmlWebpackPlugin({
       template: "./public/index.html",

shared-routing/order/webpack.config.js

@@ -2,7 +2,7 @@ const HtmlWebpackPlugin = require("html-webpack-plugin");
 const ModuleFederationPlugin = require("webpack").container
   .ModuleFederationPlugin;
 const path = require("path");
-
+const deps = require("./package.json").dependencies;
 module.exports = {
   entry: "./src/index",
   mode: "development",
@@ -15,6 +15,7 @@ module.exports = {
   },
   output: {
     publicPath: "http://localhost:3002/",
+    chunkFilename: "[id].[contenthash].js",
   },
   resolve: {
     alias: {
@@ -45,7 +46,19 @@ module.exports = {
         "./RecentOrdersWidget": "./src/RecentOrdersWidget",
         "./OrderService": "./src/OrderService",
       },
-      shared: ["react", "react-dom", "@material-ui/core", "@material-ui/icons"],
+      shared: [
+        {
+          ...deps,
+          react: {
+            singleton: true,
+            requiredVersion: deps.react,
+          },
+          "react-dom": {
+            singleton: true,
+            requiredVersion: deps["react-dom"],
+          },
+        },
+      ],
     }),
     new HtmlWebpackPlugin({
       template: "./public/index.html",

shared-routing/profile/webpack.config.js

@@ -2,7 +2,7 @@ const HtmlWebpackPlugin = require("html-webpack-plugin");
 const ModuleFederationPlugin = require("webpack").container
   .ModuleFederationPlugin;
 const path = require("path");
-
+const deps = require("./package.json").dependencies;
 module.exports = {
   entry: "./src/index",
   mode: "development",
@@ -15,6 +15,7 @@ module.exports = {
   },
   output: {
     publicPath: "http://localhost:3004/",
+    chunkFilename: "[id].[contenthash].js",
   },
   module: {
     rules: [
@@ -47,7 +48,19 @@ module.exports = {
       exposes: {
         "./ProfilePage": "./src/ProfilePage",
       },
-      shared: ["react", "react-dom", "@material-ui/core", "@material-ui/icons"],
+      shared: [
+        {
+          ...deps,
+          react: {
+            singleton: true,
+            requiredVersion: deps.react,
+          },
+          "react-dom": {
+            singleton: true,
+            requiredVersion: deps["react-dom"],
+          },
+        },
+      ],
     }),
     new HtmlWebpackPlugin({
       template: "./public/index.html",

shared-routing/sales/webpack.config.js

@@ -2,7 +2,7 @@ const HtmlWebpackPlugin = require("html-webpack-plugin");
 const ModuleFederationPlugin = require("webpack").container
   .ModuleFederationPlugin;
 const path = require("path");
-
+const deps = require("./package.json").dependencies;
 module.exports = {
   entry: "./src/index",
   mode: "development",
@@ -15,11 +15,7 @@ module.exports = {
   },
   output: {
     publicPath: "http://localhost:3003/",
-  },
-  resolve: {
-    alias: {
-      events: "events",
-    },
+    chunkFilename: "[id].[contenthash].js",
   },
   resolve: {
     alias: {
@@ -54,11 +50,17 @@ module.exports = {
         "./DepositsWidget": "./src/DepositsWidget",
       },
       shared: [
-        "react",
-        "react-dom",
-        "@material-ui/core",
-        "@material-ui/icons",
-        "recharts",
+        {
+          ...deps,
+          react: {
+            singleton: true,
+            requiredVersion: deps.react,
+          },
+          "react-dom": {
+            singleton: true,
+            requiredVersion: deps["react-dom"],
+          },
+        },
       ],
     }),
     new HtmlWebpackPlugin({

shared-routing/shell/webpack.config.js

@@ -2,7 +2,7 @@ const HtmlWebpackPlugin = require("html-webpack-plugin");
 const ModuleFederationPlugin = require("webpack").container
   .ModuleFederationPlugin;
 const path = require("path");
-
+const deps = require("./package.json").dependencies;
 module.exports = {
   entry: "./src/index",
   mode: "development",
@@ -20,6 +20,7 @@ module.exports = {
   },
   output: {
     publicPath: "http://localhost:3000/",
+    chunkFilename: "[id].[contenthash].js",
   },
   module: {
     rules: [
@@ -48,13 +49,17 @@ module.exports = {
         "./Service": "./src/Service",
       },
       shared: [
-        "react",
-        "react-dom",
-        "@material-ui/core",
-        "@material-ui/icons",
-        "react-router",
-        "react-router-dom",
-        "./src/Service",
+        {
+          ...deps,
+          react: {
+            singleton: true,
+            requiredVersion: deps.react,
+          },
+          "react-dom": {
+            singleton: true,
+            requiredVersion: deps["react-dom"],
+          },
+        },
       ],
     }),
     new HtmlWebpackPlugin({