为vuejs app创建虚拟主机由nginx返回无效的主机头

Question

尝试为vuejs app创建虚拟主机时遇到一些问题。这是我的设置：

# etc/hosts
127.0.0.1       vue.vavenger.local

# /usr/local/etc/nginx/servers/vue.vavenger.local.conf
upstream vuejs_app {
  server 127.0.0.1:8080;
}

server {
  access_log  /var/log/nginx/vue.vavenger.local.access.log;
  error_log  /var/log/nginx/vue.vavenger.local.errors.log;

root /var/www/html/vuejs_app;
index index.html;
server_name vue.vavenger.local;

location / {
  # try_files $uri $uri/ @app;
  proxy_pass http://vuejs_app;
  proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
  proxy_set_header Host $http_host;
  proxy_redirect off;
}

当我运行我的应用程序时，这个命令：

npm run serve

它会返回此错误

请给我这个问题的答案。非常感谢！

Answer 1

我相信您需要更改vue.config.js

module.exports = { devServer: { disableHostCheck: true } }