vue.js invalid host header 오류 해결 방법 !

해당 원인의 발생 이유는 블로그를 조금만 해도 찾을 수 있습니다만,

저 같은 경우 해결 방법을 찾을 수 없었습니다.

https://github.com/webpack/webpack-dev-server/blob/master/migration-v4.md

GitHub - webpack/webpack-dev-server: Serves a webpack app. Updates the browser on changes. Documentation https://webpack.js.org/

해당 사이트를 참고해 보니까, 기존 해결 방법이 deprecated 되어 있더라고요!

따라서 여러가지 해결 방법을 공유드리니, 참고 해보시고 도움되셨으면 좋겠습니다:)

 

1. vue.config.js 에 다음과 같은 문장을 추가해 줍시다. 

module.exports = { 

     devServer : { 

          disableHostCheck : true 

     }

}

 

2. 높은 버전에서는 option이 없다는 오류가 발생할 것입니다. 

저같은 경우에는 검색시에 찾아봤을 때 아무도 다음과 같은 사항을 알려주지 않아 삽질을 좀 했는데

도움이 되었으면 좋겠습니다.

 

devServer: {

allowedHosts: 'all',

},

즉, allowedHosts 옵션을 사용하여 전부 허용 시키게 하면 해당 오류가 나지 않는 것으로 확인되었습니다.

감사합니다 :)