fix typings

Author: wardpeet

packages/gatsby/src/commands/build-html.ts

@@ -7,6 +7,7 @@ import { chunk } from "lodash"
 import webpack from "webpack"
 
 import { emitter } from "../redux"
+import { IWebpackWatchingPauseResume } from "../utils/start-server"
 import webpackConfig from "../utils/webpack.config"
 import { structureWebpackErrors } from "../utils/webpack-error-utils"
 
@@ -15,19 +16,15 @@ import { IProgram, Stage } from "./types"
 type IActivity = any // TODO
 type IWorkerPool = any // TODO
 
-export interface IWebpackWatchingPauseResume extends webpack.Watching {
-  suspend: () => void
-  resume: () => void
-}
-
 let devssrWebpackCompiler: webpack.Compiler
 let devssrWebpackWatcher: IWebpackWatchingPauseResume
 let needToRecompileSSRBundle = true
-export const getDevSSRWebpack = (): Record<
-  IWebpackWatchingPauseResume,
-  webpack.Compiler,
-  needToRecompileSSRBundle
-> => {
+
+export const getDevSSRWebpack = (): {
+  devssrWebpackWatcher: IWebpackWatchingPauseResume
+  devssrWebpackCompiler: webpack.Compiler
+  needToRecompileSSRBundle: boolean
+} => {
   if (process.env.gatsby_executing_command !== `develop`) {
     throw new Error(`This function can only be called in development`)
   }

packages/gatsby/src/utils/start-server.ts

@@ -1,7 +1,5 @@
 import webpackHotMiddleware from "webpack-hot-middleware"
-import webpackDevMiddleware, {
-  WebpackDevMiddleware,
-} from "webpack-dev-middleware"
+import webpackDevMiddleware from "webpack-dev-middleware"
 import got from "got"
 import webpack from "webpack"
 import express from "express"
@@ -63,20 +61,11 @@ interface IServer {
   webpackWatching: IWebpackWatchingPauseResume
 }
 
-export interface IWebpackWatchingPauseResume extends webpack.Watching {
+export interface IWebpackWatchingPauseResume {
   suspend: () => void
   resume: () => void
 }
 
-// context seems to be public, but not documented API
-// see https://github.com/webpack/webpack-dev-middleware/issues/656
-type PatchedWebpackDevMiddleware = WebpackDevMiddleware &
-  express.RequestHandler & {
-    context: {
-      watching: IWebpackWatchingPauseResume
-    }
-  }
-
 export async function startServer(
   program: IProgram,
   app: Express,
@@ -340,13 +329,11 @@ module.exports = {
   // We serve by default an empty index.html that sets up the dev environment.
   app.use(developStatic(`public`, { index: false }))
 
-  const webpackDevMiddlewareInstance = (webpackDevMiddleware(compiler, {
-    logLevel: `silent`,
+  const webpackDevMiddlewareInstance = webpackDevMiddleware(compiler, {
     publicPath: devConfig.output.publicPath,
-    watchOptions: devConfig.devServer ? devConfig.devServer.watchOptions : null,
     stats: `errors-only`,
     serverSideRender: true,
-  }) as unknown) as PatchedWebpackDevMiddleware
+  })
 
   app.use(webpackDevMiddlewareInstance)
 

packages/gatsby/src/utils/webpack.config.js

@@ -286,7 +286,7 @@ module.exports = async (
       case `develop`:
       case `develop-html`:
       case `build-html`:
-        return `development` // So we don't uglify the html bundle
+        return `none` // So we don't uglify the html bundle
       default:
         return `production`
     }
@@ -525,10 +525,6 @@ module.exports = async (
 
     resolveLoader: getResolveLoader(),
     resolve: getResolve(stage),
-
-    node: {
-      __filename: true,
-    },
   }
 
   if (stage === `build-javascript`) {
@@ -539,7 +535,7 @@ module.exports = async (
       chunks: `all`,
       cacheGroups: {
         default: false,
-        vendors: false,
+        defaultVendors: false,
         framework: {
           chunks: `all`,
           name: `framework`,
@@ -628,9 +624,7 @@ module.exports = async (
         name: `webpack-runtime`,
       },
       // use hashes instead of ids for module identifiers
-      // TODO update to deterministic in webpack 5 (hashed is deprecated)
-      // @see https://webpack.js.org/guides/caching/#module-identifiers
-      moduleIds: `hashed`,
+      moduleIds: `deterministic`,
       splitChunks,
       minimizer: [
         // TODO: maybe this option should be noMinimize?
@@ -692,7 +686,7 @@ module.exports = async (
     }
 
     config.externals = [
-      function (context, request, callback) {
+      function ({ context, request }, callback) {
         if (
           stage === `develop-html` &&
           isCI() &&