Vue CLI 运行服务始终在本地主机上运行

时间:2021-06-17 17:21:48

标签: javascript vue.js localhost vue-cli

我有一个使用 Vue CLI 创建的 vue.js 项目,npm run serve它总是在本地主机上运行。

我想从我的手机(同一网络内的另一个 IP)访问,所以我希望服务在 0.0.0.0 上运行。我尝试添加 vue.config.js 文件并设置主机:

module.exports = {
    publicPath: '/',
    devServer: {
        host: '0.0.0.0',
        port: 8080
    }
}

更改端口工作正常,但忽略主机覆盖。这是服务的输出:

App running at:
  - Local:   http://localhost:8080/
  - Network: http://192.168.0.21:8080/

一开始我以为是被忽略了,所以我尝试将主机设置为0.0.0.1并且输出是“正确的”,所以文件没有被忽略,只有0.0.0.0被更改为localhost

  App running at:
  - Local:   http://0.0.0.1:8080/
  - Network: http://0.0.0.1:8080/

我在一些论坛上看到 devServer 有一个 public 选项来设置 URL,但是如果我尝试设置 pubic: 'http://0.0.0.0:8080/',我会收到一个错误:

> npm run serve
Debugger attached.

> vue-model-viewer@0.1.0 serve <my project path>
> vue-cli-service serve

Debugger attached.
 INFO  Starting development server...
 ERROR  ValidationError: webpack Dev Server Invalid Options

options should NOT have additional properties

ValidationError: webpack Dev Server Invalid Options

options should NOT have additional properties

我需要在 0.0.0.0 上运行服务器,以便我可以在手机上进行测试。

任何帮助将不胜感激。

1 个答案:

答案 0 :(得分:0)

您不需要在本地机器上的 0.0.0.0 上运行它来在手机上测试它。只要它运行的端口对外部流量开放,并且您的手机通过 wifi 连接到您的局域网,您就可以将计算机的 IP 地址和端口 # 作为 URL。