feat: add new option

CHANGELOG.md

@@ -2,6 +2,13 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+## [5.0.0](https://github.com/webpack/webpack-dev-middleware/compare/v4.3.0...v5.0.0) (2021-06-02)
+
+
+### ⚠ BREAKING CHANGES
+
+* minimum supported `Node.js` version is `12.13.0` ([#928](https://github.com/webpack/webpack-dev-middleware/issues/928)) ([4cffeff](https://github.com/webpack/webpack-dev-middleware/commit/4cffeffb5fd07ea79e5a7a5a0cdb3f08f3856c06))
+
 ## [4.3.0](https://github.com/webpack/webpack-dev-middleware/compare/v4.2.0...v4.3.0) (2021-05-19)
 
 

README.md

@@ -124,6 +124,13 @@ The public path that the middleware is bound to.
 
 _Best Practice: use the same `publicPath` defined in your webpack config. For more information about `publicPath`, please see [the webpack documentation](https://webpack.js.org/guides/public-path)._
 
+### historyApiFallback
+
+type: `Boolean`
+Default: `false`
+
+When using the HTML5 History API, the index.html page will likely have to be served in place of any 404 responses. Enable historyApiFallback by setting it to true
+
 ### stats
 
 Type: `Boolean|String|Object`

babel.config.js

@@ -10,7 +10,7 @@ module.exports = (api) => {
         "@babel/preset-env",
         {
           targets: {
-            node: "10.13.0",
+            node: "12.13.0",
           },
         },
       ],

package.json

@@ -1,6 +1,6 @@
 {
   "name": "webpack-dev-middleware",
-  "version": "4.3.0",
+  "version": "5.0.0",
   "description": "A development middleware for webpack",
   "license": "MIT",
   "repository": "webpack/webpack-dev-middleware",
@@ -13,16 +13,16 @@
     "url": "https://opencollective.com/webpack"
   },
   "engines": {
-    "node": ">= v10.23.3"
+    "node": ">= 12.13.0"
   },
   "scripts": {
     "commitlint": "commitlint --from=master",
-    "lint:prettier": "prettier \"{**/*,*}.{js,json,md,yml,css}\" --list-different",
+    "fmt:check": "prettier \"{**/*,*}.{js,json,md,yml,css}\" --list-different",
     "lint:js": "eslint --cache src test",
-    "lint": "npm-run-all -l -p \"lint:**\"",
-    "fix:prettier": "npm run lint:prettier -- --write",
+    "lint": "npm-run-all lint:js fmt:check",
+    "fmt": "npm run fmt:check -- --write",
     "fix:js": "npm run lint:js -- --fix",
-    "fix": "npm-run-all fix:js fix:prettier",
+    "fix": "npm-run-all fix:js fmt",
     "prepare": "husky install && npm run build",
     "build": "del dist && babel src -d dist --copy-files",
     "release": "standard-version",
@@ -43,18 +43,18 @@
     "colorette": "^1.2.2",
     "mem": "^8.1.1",
     "memfs": "^3.2.2",
-    "mime-types": "^2.1.30",
+    "mime-types": "^2.1.31",
     "range-parser": "^1.2.1",
     "schema-utils": "^3.0.0"
   },
   "devDependencies": {
     "@babel/cli": "^7.14.3",
     "@babel/core": "^7.14.3",
-    "@babel/preset-env": "^7.14.2",
+    "@babel/preset-env": "^7.14.4",
     "@commitlint/cli": "^12.1.4",
     "@commitlint/config-conventional": "^12.1.4",
     "@webpack-contrib/eslint-config-webpack": "^3.0.0",
-    "babel-jest": "^26.6.3",
+    "babel-jest": "^27.0.2",
     "chokidar": "^3.5.1",
     "connect": "^3.7.0",
     "cross-env": "^7.0.3",
@@ -63,19 +63,19 @@
     "del-cli": "^3.0.1",
     "eslint": "^7.26.0",
     "eslint-config-prettier": "^8.3.0",
-    "eslint-plugin-import": "^2.22.1",
-    "execa": "^5.0.0",
+    "eslint-plugin-import": "^2.23.4",
+    "execa": "^5.0.1",
     "express": "^4.17.1",
     "file-loader": "^6.2.0",
     "husky": "^6.0.0",
-    "jest": "^26.6.3",
+    "jest": "^27.0.3",
     "lint-staged": "^11.0.0",
     "npm-run-all": "^4.1.5",
     "prettier": "^2.3.0",
     "standard-version": "^9.3.0",
     "strip-ansi": "^6.0.0",
     "supertest": "^6.1.3",
-    "webpack": "^5.37.0"
+    "webpack": "^5.38.1"
   },
   "keywords": [
     "webpack",

src/options.json

@@ -48,6 +48,10 @@
         }
       ]
     },
+    "historyApiFallback": {
+      "description": "When using the HTML5 History API, the index.html page will likely have to be served in place of any 404 responses. Enable historyApiFallback by setting it to true",
+      "type": "boolean"
+    },
     "stats": {
       "description": "Stats options object or preset name.",
       "anyOf": [

src/utils/getFilenameFromUrl.js

@@ -53,8 +53,14 @@ export default function getFilenameFromUrl(context, url) {
         filename = path.join(outputPath, querystring.unescape(pathname));
       }
 
-      let fsStats;
+      if (
+        !context.outputFileSystem.existsSync(filename) &&
+        options.historyApiFallback
+      ) {
+        filename = path.join(outputPath);
+      }
 
+      let fsStats;
       try {
         fsStats = context.outputFileSystem.statSync(filename);
       } catch (_ignoreError) {

test/logging.test.js

@@ -851,7 +851,7 @@ describe("logging", () => {
   });
 
   if (os.platform() !== "win32") {
-    it('should logging an error from the fs error when the "writeToDisk" option is "true"', async (done) => {
+    it('should logging an error from the fs error when the "writeToDisk" option is "true"', (done) => {
       // eslint-disable-next-line global-require
       const clearDirectory = require("./helpers/clearDirectory").default;
       const outputDir = path.resolve(

test/middleware.test.js

@@ -2566,6 +2566,27 @@ describe.each([
       });
     });
 
+    describe("historyApiFallback option", () => {
+      describe("index.html page will likely have to be served in place of any 404 responses", () => {
+        beforeAll((done) => {
+          const compiler = getCompiler(webpackConfig);
+
+          instance = middleware(compiler, { historyApiFallback: true });
+
+          app = framework();
+          app.use(instance);
+
+          listen = listenShorthand(done);
+        });
+
+        afterAll(close);
+
+        it('should return the "200" code for the "GET" request', (done) => {
+          request(app).get("/foo/bar/baz").expect(200, done);
+        });
+      });
+    });
+
     describe("serverSideRender option", () => {
       let locals;
 

test/validation-options.test.js

@@ -35,6 +35,10 @@ describe("validation", () => {
       success: ["/foo", "", "auto", () => "/public/path"],
       failure: [false],
     },
+    historyApiFallback: {
+      success: [true],
+      failure: [],
+    },
     serverSideRender: {
       success: [true],
       failure: ["foo", 0],