Webpack 5.10.0 with @types/webpack-env 1.16.0 - HMR error "Property 'hot' does not exist on type 'NodeModule'"

Question

As per the Webpack 5 docs, I no longer have @types/webpack installed, although I have tried installing this to see if it made any difference and it did not.

My AppEntry: -

if (module.hot) {
module.hot.accept('./App', () => {
/* eslint-disable-next-line */
const NextApp = require('./App').default
renderApp(NextApp)
  })
}

In my devDepedencies I have types/webpack-env installed: -

"@types/webpack-env": "^1.16.0",

Why am I still getting this error? I am using VSCode, tried a fresh install on yarn and restarting VSCode but it's not helping.

Can anyone help? Thanks.

Edit: -

My tsconfig: -

{
  "include": [
    "client/src/**/*.ts", "client/src/**/*.tsx"
  ],
  "exclude": [
    "node_modules",
    "/*.*"
  ],
  "compileOnSave": false,
  "compilerOptions": {
    "allowJs": true,
    "allowSyntheticDefaultImports": true,
    "baseUrl": ".",
    "esModuleInterop": true,
    "forceConsistentCasingInFileNames": true,
    "isolatedModules": true,
    "jsx": "react",
    "lib": ["es5", "es6", "dom"],
    "module": "commonjs",
    "moduleResolution": "node",
    "noEmit": true,
    "noImplicitAny": false,
    "outDir": "./client/dist/",
    "preserveConstEnums": true,
    "removeComments": true,
    "resolveJsonModule": true,
    "skipLibCheck": true,
    "sourceMap": true,
    "strict": false,
    "target": "es5",
    "types": []
  }
}

Answer 1

Simple mistake - I was not including the types in my tconfig.json. Fixed: -

"types": [ "webpack-env" ],