[Vuejs]-HMR tls issues with Visual Studio 2022 Vue template

0👍

Just fix same Error. Try this

in vue.config.js

module.exports = {
devServer: {
    host: '0.0.0.0',
    public: '0.0.0.0:5002',
    disableHostCheck: true,

0👍

I am using @vue/cli 5.0.4 in a project with webpack-dev-server@4.9.0

I tried the solution from @asp.entwickler but got some errors because disableHostCheck and public have been deprecated.

According to https://cli.vuejs.org/migrations/migrate-from-v4.html#vue-cli-service

webpack-dev-server has been updated from v3 to v4. So there are breaking changes with regard to the devServer option in vue.config.js.

The disableHostCheck option was removed in favor allowedHosts: ‘all’;
public, sockHost, sockPath, and sockPort options were removed in favor client.webSocketURL option.

so the solution was to set devServer.client.webSocketURL.hostname. Also setting allowedHosts: 'auto' instead of ‘all’ seems to be a good idea unless you really need it.

When set to ‘auto’ this option always allows localhost, host, and client.webSocketURL.hostname:

module.exports = {
    devServer: {
        allowedHosts: 'auto',
        client: {
            webSocketURL:
            {
                hostname: 'localhost'
            }
        },

Leave a comment