[FIXED] I want to use Vue js with Symfony 5, but I faced an error when run this command "yarn encore dev-server"

Issue

I run the command yarn encore dev-server in Symfony 5 with Vue.js. I faced an error below:

PS C:\Apache24\htdocs\api_example> yarn encore dev-server

yarn run v1.22.5

$ C:\Apache24\htdocs\api_example\node_modules\.bin\encore dev-server

Running webpack-dev-server ...

 RECOMMEND  To create a smaller (and CSP-compliant) build, see https://symfony.com/doc/current/frontend/encore/vuejs.html#runtime-compiler-build

**[webpack-cli] Invalid options object. Dev Server has been initialized using an options object that does not match the API schema.
 - options.client has an unknown property 'host'. These properties are valid:
   object { logging?, overlay?, progress?, webSocketTransport?, webSocketURL? }**


error Command failed with exit code 2.

info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

Solution

Webpack Dev Server has just released a new version: v4.0.0-rc.0. It's incompatible with the (default settings of) Webpack Encore.

You can stick to v4.0.0-beta.3 for a while, until Webpack Encore has been updated to support the new version.

Use yarn add webpack-dev-server@v4.0.0-beta.3 --dev to use this exact version.

Follow this issue to see if there is any progress, or if you want to use quick fixes to use the new webpack-dev-server.

Answered By - Stephan Vierkant