new vue.js project preview yields "Invalid Host header"

[csells]

Installing the vue cli via "npm i -g @vue/cli" and running "vue create hello-world" worked great. However, running it with "yarn serve" and previewing the output on port 8080 yielded a page that said only "Invalid Host header".

[svenefftinge]

The dev server isn't accepting external requests. You need to put below's config

// vue.config.js
module.exports = {
    // options...
    devServer: {
        disableHostCheck: true
    }
}

[csells]

Yep. That did the trick.

[svenefftinge]

Also the host needs to be passed and set to 0.0.0.0 as it defaults to only accepting localhost.

webpack-dev-server --host 0.0.0.0

[svenefftinge]

Btw. the latest update includes full support for *.vue files.

[Code9117]

Thanks!your answer.my name is bobo.

[tribals]

Closed, but it is better to use devServer.public: https://webpack.js.org/configuration/dev-server/#devserver-public

[sobiero]

The dev server isn't accepting external requests. You need to put below's config

// vue.config.js
module.exports = {
    // options...
    devServer: {
        disableHostCheck: true
    }
}

Where is the file vue.config.js located or do I need to create it? I'm using vue/cli 3.9

[brunogcpinheiro]

@sobiero Yes, create it in root!

[scozma]

The dev server isn't accepting external requests. You need to put below's config

// vue.config.js
module.exports = {
    // options...
    devServer: {
        disableHostCheck: true
    }
}

Where is the file vue.config.js located or do I need to create it? I'm using vue/cli 3.9

You can create a file with that name if you don't have it and add it on the root of your project (same level as package.json for example)

[qkmc-rk]

The dev server isn't accepting external requests. You need to put below's config

// vue.config.js
module.exports = {
// options...
devServer: {
disableHostCheck: true
}
}
Where is the file vue.config.js located or do I need to create it? I'm using vue/cli 3.9
You can create a file with that name if you don't have it and add it on the root of your project (same level as package.json for example)