fix(web): @nrwl/web:file-server throws 404 after refresh (#9839)

docs/generated/packages/web.json

@@ -937,6 +937,11 @@
             "type": "boolean",
             "description": "Watch for file changes.",
             "default": true
+          },
+          "spa": {
+            "type": "boolean",
+            "description": "Redirect 404 errors to index.html (useful for SPA's)",
+            "default": false
           }
         },
         "additionalProperties": false,

packages/web/src/executors/file-server/file-server.impl.ts

@@ -1,15 +1,18 @@
-import {
-  ExecutorContext,
-  joinPathFragments,
-  workspaceLayout,
-} from '@nrwl/devkit';
 import * as chalk from 'chalk';
 import { execFileSync, fork } from 'child_process';
 import { watch } from 'chokidar';
+import { copyFileSync, unlinkSync } from 'fs';
 import { createIgnore } from 'nx/src/utils/ignore';
 import { readModulePackageJson } from 'nx/src/utils/package-json';
 import { platform } from 'os';
-import { resolve } from 'path';
+import { join, resolve } from 'path';
+
+import {
+  ExecutorContext,
+  joinPathFragments,
+  workspaceLayout,
+} from '@nrwl/devkit';
+
 import { Schema } from './schema';
 
 // platform specific command name
@@ -139,6 +142,15 @@ export default async function* fileServerExecutor(
   run();
 
   const outputPath = getBuildTargetOutputPath(options, context);
+
+  if (options.spa) {
+    const src = join(outputPath, 'index.html');
+    const dst = join(outputPath, '404.html');
+
+    // See: https://github.com/http-party/http-server#magic-files
+    copyFileSync(src, dst);
+  }
+
   const args = getHttpServerArgs(options);
 
   const { path: pathToHttpServerPkgJson, packageJson } =
@@ -163,6 +175,10 @@ export default async function* fileServerExecutor(
     if (disposeWatch) {
       disposeWatch();
     }
+
+    if (options.spa) {
+      unlinkSync(join(outputPath, '404.html'));
+    }
   };
   process.on('exit', processExitListener);
   process.on('SIGTERM', processExitListener);

packages/web/src/executors/file-server/schema.d.ts

@@ -11,4 +11,5 @@ export interface Schema {
   withDeps: boolean;
   proxyOptions?: object;
   watch?: boolean;
+  spa: boolean;
 }

packages/web/src/executors/file-server/schema.json

@@ -60,6 +60,11 @@
       "type": "boolean",
       "description": "Watch for file changes.",
       "default": true
+    },
+    "spa": {
+      "type": "boolean",
+      "description": "Redirect 404 errors to index.html (useful for SPA's)",
+      "default": false
     }
   },
   "additionalProperties": false,