Don't know why 2 days ago my projects ( created via vue create ) stopped working - in Chrome i get
Invalid Host Header
and
WDS Disconnected
errors. In cmd everything compiles properly( npm run serve ) I don't know webpack, so i have no idea how to fix it.
What i've already done:
This issue is caused by this webpack-dev-server issue that has been fixed recently.
To avoid getting the Invalid Host/Origin header error add this to your devServer entry on vue.config.js file:
disableHostCheck: true
Found this question searching for the same "Invalid Host Header" issue. Here's how I solved it.
I am running Vue dev server npm run serve
in Docker on my remote server. Couldn't access it at http://example.com:8080
with the error message above.
Correct and secure way is to add the domain name to the vue.config.js
file:
"devServer": {
"public": "example.com"
}
This is a fresh vue project initiated with Vue Cli command: vue create myproject
with Vuetify added via vue add vuetify
. Full content of my vue.config.js
after that is:
module.exports = {
"transpileDependencies": [
"vuetify"
],
"devServer": {
"public": "example.com"
}
}
Note that disableHostCheck: true
is not recommended because it creates security vulnerabilities .
For a dev server running on my local machine, I could resolve the issue by explicitly setting --host
in vue-cli-service serve
:
scripts: {
serve: "vue-cli-service serve --host myapp.localhost"
}
The --host
option is documented here .
Visit the app in your browser under myapp.localhost:8080
(assuming you're using default port 8080
).
This is because of the dev server which isn't accepting external requests. To solve this, we've to configure vue.config.js
as below.
If vue.config.js
is not found in your vue project, please create the file in root directory and add the following line.
module.exports = {
// options...
devServer: {
disableHostCheck: true
}
}
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.