Webpack invalid options object when using writeToDisk

Question

I'm trying to use webpack for my web development project, but can't figure out how to use the writeToDisk option.

Here's my webpack.config.development.js file:

const { merge } = require('webpack-merge')
const path = require('path')

const config = require('./webpack.config')

module.exports = merge(config, {
  mode: 'development',

  devtool: 'inline-source-map',

  devServer: {
    writeToDisk: true
  },

  output: {
    path: path.resolve(__dirname, 'public')
  }
})

And the result when I run npm start is the following:

C:\Users\natha\OneDrive\Documents\web\floema>npm start

> [email protected] start
> npm run development


> [email protected] development
> webpack serve --progress --config webpack.config.development.js

C:\Users\natha\OneDrive\Documents\web\floema\app C:\Users\natha\OneDrive\Documents\web\floema\assets C:\Users\natha\OneDrive\Documents\web\floema\styles
1% setup initialize[webpack-cli] Invalid options object. Dev Server has been initialized using an options object that does not match the API schema.
 - options has an unknown property 'writeToDisk'. These properties are valid:
   object { allowedHosts?, bonjour?, client?, compress?, devMiddleware?, headers?, historyApiFallback?, host?, hot?, http2?, https?, ipc?, liveReload?, magicHtml?, onAfterSetupMiddleware?, onBeforeSetupMiddleware?, onListening?, open?, port?, proxy?, server?, setupExitSignals?, setupMiddlewares?, static?, watchFiles?, webSocketServer? }

Thanks !

Answer 1

As documented in https://github.com/webpack/webpack-dev-server/blob/master/migration-v4.md and https://github.com/webpack/webpack-dev-server/issues/3768, the option writeToDisk was moved to devServer.devMiddleware, so it needs to be configured like this now:

module.exports = {
  devServer: {
    devMiddleware: {
      writeToDisk: true,
    },
  },
};