diff --git a/docusaurus/docs/webpack-module-federation.md b/docusaurus/docs/webpack-module-federation.md
new file mode 100644
index 00000000000..2d700189310
--- /dev/null
+++ b/docusaurus/docs/webpack-module-federation.md
@@ -0,0 +1,21 @@
+---
+id: webpack-module-federation
+title: Webpack Module Federation
+---
+
+[Webpack Module Federation](https://webpack.js.org/concepts/module-federation) is a feature made available in Webpack 5.
+
+## Configuring Webpack Module Federation
+To get started, create `src/setupModuleFederation.js` and place the following contents in it:
+```js
+module.exports = {
+  name: 'test',
+  library: { type: 'var', name: 'test' },
+  filename: 'remoteEntry.js',
+  exposes: { '.': './src/App.js' }
+}
+```
+
+You can now modify this configuration to suit your needs. [See here](https://webpack.js.org/plugins/module-federation-plugin#sharing-hints) for Module Federation Plugin's configuraiton options.
+
+> **Note:** Since Micro-frontend apps do not typically have their own `index.html` (unless they're using iframes), the `index.html` file in the public folder is an optional file and can be removed if not applicable to your app.
diff --git a/docusaurus/website/sidebars.json b/docusaurus/website/sidebars.json
index 386a29da1bf..1d8d7df80fb 100644
--- a/docusaurus/website/sidebars.json
+++ b/docusaurus/website/sidebars.json
@@ -48,6 +48,7 @@
     ],
     "Deployment": ["deployment"],
     "Advanced Usage": [
+      "webpack-module-federation",
       "custom-templates",
       "can-i-use-decorators",
       "pre-rendering-into-static-html-files",
diff --git a/packages/react-scripts/config/paths.js b/packages/react-scripts/config/paths.js
index f4470a02f63..30a8330c5c3 100644
--- a/packages/react-scripts/config/paths.js
+++ b/packages/react-scripts/config/paths.js
@@ -72,6 +72,7 @@ module.exports = {
   appJsConfig: resolveApp('jsconfig.json'),
   yarnLockFile: resolveApp('yarn.lock'),
   testsSetup: resolveModule(resolveApp, 'src/setupTests'),
+  mfSetup: resolveApp('src/setupModuleFederation.js'),
   proxySetup: resolveApp('src/setupProxy.js'),
   appNodeModules: resolveApp('node_modules'),
   appWebpackCache: resolveApp('node_modules/.cache'),
@@ -97,6 +98,7 @@ module.exports = {
   appJsConfig: resolveApp('jsconfig.json'),
   yarnLockFile: resolveApp('yarn.lock'),
   testsSetup: resolveModule(resolveApp, 'src/setupTests'),
+  mfSetup: resolveApp('src/setupModuleFederation.js'),
   proxySetup: resolveApp('src/setupProxy.js'),
   appNodeModules: resolveApp('node_modules'),
   appWebpackCache: resolveApp('node_modules/.cache'),
@@ -135,6 +137,7 @@ if (
     appJsConfig: resolveOwn(`${templatePath}/jsconfig.json`),
     yarnLockFile: resolveOwn(`${templatePath}/yarn.lock`),
     testsSetup: resolveModule(resolveOwn, `${templatePath}/src/setupTests`),
+    mfSetup: resolveOwn(`${templatePath}/src/setupModuleFederation.js`),
     proxySetup: resolveOwn(`${templatePath}/src/setupProxy.js`),
     appNodeModules: resolveOwn('node_modules'),
     appWebpackCache: resolveOwn('node_modules/.cache'),
diff --git a/packages/react-scripts/config/webpack.config.js b/packages/react-scripts/config/webpack.config.js
index e465d8e7a00..e772ca9f552 100644
--- a/packages/react-scripts/config/webpack.config.js
+++ b/packages/react-scripts/config/webpack.config.js
@@ -605,43 +605,46 @@ module.exports = function (webpackEnv) {
     },
     plugins: [
       // Generates an `index.html` file with the <script> injected.
-      new HtmlWebpackPlugin(
-        Object.assign(
-          {},
-          {
-            inject: true,
-            template: paths.appHtml,
-          },
-          isEnvProduction
-            ? {
-                minify: {
-                  removeComments: true,
-                  collapseWhitespace: true,
-                  removeRedundantAttributes: true,
-                  useShortDoctype: true,
-                  removeEmptyAttributes: true,
-                  removeStyleLinkTypeAttributes: true,
-                  keepClosingSlash: true,
-                  minifyJS: true,
-                  minifyCSS: true,
-                  minifyURLs: true,
-                },
-              }
-            : undefined
-        )
-      ),
+      fs.existsSync(paths.appHtml) &&
+        new HtmlWebpackPlugin(
+          Object.assign(
+            {},
+            {
+              inject: true,
+              template: paths.appHtml,
+            },
+            isEnvProduction
+              ? {
+                  minify: {
+                    removeComments: true,
+                    collapseWhitespace: true,
+                    removeRedundantAttributes: true,
+                    useShortDoctype: true,
+                    removeEmptyAttributes: true,
+                    removeStyleLinkTypeAttributes: true,
+                    keepClosingSlash: true,
+                    minifyJS: true,
+                    minifyCSS: true,
+                    minifyURLs: true,
+                  },
+                }
+              : undefined
+          )
+        ),
       // Inlines the webpack runtime script. This script is too small to warrant
       // a network request.
       // https://github.com/facebook/create-react-app/issues/5358
       isEnvProduction &&
         shouldInlineRuntimeChunk &&
-        new InlineChunkHtmlPlugin(HtmlWebpackPlugin, [/runtime-.+[.]js/]),
+          fs.existsSync(paths.appHtml) &&
+            new InlineChunkHtmlPlugin(HtmlWebpackPlugin, [/runtime-.+[.]js/]),
       // Makes some environment variables available in index.html.
       // The public URL is available as %PUBLIC_URL% in index.html, e.g.:
       // <link rel="icon" href="%PUBLIC_URL%/favicon.ico">
       // It will be an empty string unless you specify "homepage"
       // in `package.json`, in which case it will be the pathname of that URL.
-      new InterpolateHtmlPlugin(HtmlWebpackPlugin, env.raw),
+      fs.existsSync(paths.appHtml) &&
+        new InterpolateHtmlPlugin(HtmlWebpackPlugin, env.raw),
       // This gives some necessary context to module not found errors, such as
       // the requesting resource.
       new ModuleNotFoundPlugin(paths.appPath),
@@ -788,6 +791,8 @@ module.exports = function (webpackEnv) {
             },
           },
         }),
+      fs.existsSync(paths.mfSetup) &&
+        new webpack.container.ModuleFederationPlugin(require(paths.mfSetup)),
     ].filter(Boolean),
     // Turn off performance processing because we utilize
     // our own hints via the FileSizeReporter
diff --git a/packages/react-scripts/scripts/build.js b/packages/react-scripts/scripts/build.js
index 7a3a635a5d3..8ea543023f4 100644
--- a/packages/react-scripts/scripts/build.js
+++ b/packages/react-scripts/scripts/build.js
@@ -47,7 +47,7 @@ const WARN_AFTER_CHUNK_GZIP_SIZE = 1024 * 1024;
 const isInteractive = process.stdout.isTTY;
 
 // Warn and crash if required files are missing
-if (!checkRequiredFiles([paths.appHtml, paths.appIndexJs])) {
+if (!checkRequiredFiles([paths.appIndexJs])) {
   process.exit(1);
 }
 
@@ -70,8 +70,10 @@ checkBrowsers(paths.appPath, isInteractive)
     // Remove all content but keep the directory so that
     // if you're in it, you don't end up in Trash
     fs.emptyDirSync(paths.appBuild);
-    // Merge with the public folder
-    copyPublicFolder();
+    // If public folder exists, then merge build with the public folder
+    if (fs.existsSync(paths.appPublic)) {
+      copyPublicFolder();
+    }
     // Start the webpack build
     return build(previousFileSizes);
   })
diff --git a/packages/react-scripts/scripts/start.js b/packages/react-scripts/scripts/start.js
index 8b9a2c26b4d..a8d5c3a5db0 100644
--- a/packages/react-scripts/scripts/start.js
+++ b/packages/react-scripts/scripts/start.js
@@ -47,7 +47,7 @@ const useYarn = fs.existsSync(paths.yarnLockFile);
 const isInteractive = process.stdout.isTTY;
 
 // Warn and crash if required files are missing
-if (!checkRequiredFiles([paths.appHtml, paths.appIndexJs])) {
+if (!checkRequiredFiles([paths.appIndexJs])) {
   process.exit(1);
 }