Invalid options object. Dev Server has been initialized using an options object that does not match the API schema.

[joetidee]

Describe the bug
I am running this command:
webpack-dev-server --hot --config webpack.dev.config.js --color

and getting this error:

[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 'watchOptions'. 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?, setupExitSignals?, static?, watchFiles?, webSocketServer? }

webpack.dev.config.js:

...
devServer: {
    host: require('os').hostname().toLowerCase(),
    compress: true,
    contentBase: BUILD_DIR,
    disableHostCheck: true,
    historyApiFallback: {
        disableDotRule: true,
    },
    inline: true,
    port: 3001,
    watchOptions: {
        ignored: ['cypress','node_modules']
    }
}
...

Packages used:
"webpack": "^4.41.2",
"webpack-cli": "^4.8.0",
"webpack-dev-server": "^4.3.0",

watchOptions is defined in the webpack v4 spec, so why is this error being thrown?

[snitin315]

contentBase/contentBasePublicPath/serveIndex/watchContentBase/watchOptions/staticOptions options were moved to static option

Please read the migration guide at https://github.com/webpack/webpack-dev-server/blob/master/migration-v4.md

[Arsalan1only]

while calling remote app getting [object object] i used webpack when i open separate it's work fine but when open in host app and call remote app getting error [object object]

[jamessv]

Full code is here

const path = require('path')
const htmlWebpackPlugin = require('html-webpack-plugin')
require('babel-register')

module.exports = {
entry: ['@babel/polyfill', './src/app.js'],
output: {
path: path.resolve(__dirname, 'dist'),
filename: 'bundle.js'
},
module: {
rules: [
{
test: /.js$/,
exclude: /node_modules/,
use: ['babel-loader']
}
]
},
plugins: [
new htmlWebpackPlugin({
template: './index.html'
})
],
mode: 'development',
devtool: 'inline-source-map',
devServer: {
static: {
directory: path.resolve(__dirname, 'app'),
},
}
}