如何为 Vue CLI 3 项目设置虚拟主机
Posted
技术标签:
【中文标题】如何为 Vue CLI 3 项目设置虚拟主机【英文标题】:How to Set Up Virtual Host for Vue CLI 3 Project 【发布时间】:2019-01-23 22:55:45 【问题描述】:我希望能够从 http://pbdev
而不是 localhost:8080
访问我的 Vue 项目。我熟悉在 Apache 中创建虚拟主机,但我不清楚如何使用 Vue CLI 3 项目来做到这一点。
到目前为止,我已经把这个放在/etc/hosts
:
# Vue Hosts
127.0.0.1:8080 pbdev
我把这个放在vue.config.js
:
module.exports =
lintOnSave: false,
devServer:
host: 'pbdev',
port: 8080,
https: false
我收到以下错误:
INFO Starting development server...
10% building modules 1/1 modules 0 activeevents.js:167
throw er; // Unhandled 'error' event
^
Error: getaddrinfo ENOTFOUND pbdev
at GetAddrInfoReqWrap.onlookup [as oncomplete] (dns.js:57:26)
Emitted 'error' event at:
at GetAddrInfoReqWrap.doListen [as callback] (net.js:1505:12)
at GetAddrInfoReqWrap.onlookup [as oncomplete] (dns.js:57:17)
有谁知道我做错了什么?
【问题讨论】:
:8080
中的/etc/hosts
是问题所在,只需执行127.0.0.1 pbdev
啊,太棒了! @EricGuan 如果您想将其发布为答案,我会接受。谢谢你的帮助! :)
【参考方案1】:
/etc/hosts
中的:8080
是问题所在,只需执行127.0.0.1 pbdev
快乐 Vueing!
【讨论】:
【参考方案2】:真是个好问题!值得庆幸的是,Vue CLI 3 使用 --host
标志使它变得相当简单,您可以在其中传递自定义主机和 --port
用于自定义端口。您不必配置 Apache 或自定义 Web 服务器。
Vue CLI 指南有一些详细信息:https://cli.vuejs.org/guide/cli-service.html#vue-cli-service-serve。
【讨论】:
谢谢! :) 我所做的几乎奏效了。我只是错误地将端口号包含在我的/etc/hosts
文件中。通过在vue.config.js
文件中指定它,我不必在每次启动服务器时一遍又一遍地指定它。现在效果很好。以上是关于如何为 Vue CLI 3 项目设置虚拟主机的主要内容,如果未能解决你的问题,请参考以下文章