CODEWITHSUNDEEP
javascriptvue.jslocalhostvue-cli
Lluis Queralt
Lluis Queralt

Reputation: 15

Vue CLI run serve always running on localhost

I have a vue.js project created with Vue CLI and npm run serveit always run on localhost.

I want to access from my phone (another IP inside the same network), so I want the serve to run on 0.0.0.0. I tried adding the vue.config.js file and setting the host:

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

Changing the port works fine, but the host override is ignored. This is the output of serve:

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

At first I thought it was being ignored, so I tried setting the host to 0.0.0.1 and the output is "correct", so the file is not ignored, only the 0.0.0.0 is being changed to localhost:

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

I saw in some forums that devServer has a public option to set the URL, but if I try setting pubic: 'http://0.0.0.0:8080/' I get an error:

> npm run serve
Debugger attached.

> [email protected] 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

I need to run the server on 0.0.0.0 so I can test it on my phone.

Any help will be very appreciated.

Upvotes: 0

Views: 6413

Answers (1)

selfagency
selfagency

Reputation: 1578

You shouldn't need to run it on 0.0.0.0 from your local machine to test it on your phone. As long as the port on which it's running is open to external traffic and your phone is connected to your LAN via wifi, you can just put the IP address of your computer and the port # in as the URL.

Upvotes: 1

Related Questions