baseUrl default port is :3000 even when nuxt use a random port

[mrleblanc101]

Version

v5.8.0

Reproduction link

https://codesandbox.io/

Steps to reproduce

1. Run nuxt dev when port 3000 is already in use
2. Nuxt will start on a random port
3. Do not edit the axios object in nuxt.config.js
4. Call to localhost will fail because they will use port 3000 instead of random nuxt port

What is expected ?

Axios should use process.env. NUXT_PORT

What is actually happening?

Axios default to port 3000

Additionnal info

I do this because I load json data hosted in the static folder. I can't use import as these fill will be updated regularly via a setInterval

_{This bug report is available on Nuxt community (#c302)}

[mrleblanc101]

Setting baseURL: '/' did the trick, but it's weird I feel like if I do not set the baseURL, it should bind to the correct port

[gtl-alex]

@mrleblanc101 That didn't help my situation, but setting browserBaseURL: '/' did the trick. Thanks for the direction.

[pwmb]

but setting browserBaseURL: '/' did the trick

For me as well

[scscgit]

This issue is still there, creating a huge usability barrier for Nuxt beginners who have to spend hours debugging why this.$axios behaves differently than import 'axios' when trying to load static files hosted with the application. Without accidentally finding @mrleblanc101's recommendation to add baseURL: '/' under axios: in nuxt.config.ts there's no way to find out a solution - please mention this vital fact at https://axios.nuxtjs.org/setup ! (Plus there's no explanation about whether using plain import axios is still viable in some situations and how is it impacted by the configuration, considering there's no way to directly import and use @nuxtjs/axios to be used outside Vue component or Store.) I'd recommend setting the '/' value to be the default when not configured explicitly, is there any reason why people who generate static files should find localhost:3000 hard-coded into their .js sources? The documentation doesn't even explain how the projects are "supposed to" be configured on server when deploying static SPA, for example via nginx in Docker. In any case, https://github.com/nuxt/create-nuxt-app project generator could also address this issue by including baseURL: '/' by default. There's also another open issue from year 2019 https://github.com/nuxt-community/axios-module/issues/274 which doesn't even mention the baseURL: '/' workaround.

[farnabaz]

@mrleblanc101 You can change axios port using process.env.API_PORT.
As @gtl-alex mentioned for the client side you can use browserBaseURL: '/' to use website domain.

[manusiakemos]

work for me with this config

 axios: {
    baseURL: "http://localhost:8000",
    browserBaseURL: "http://localhost:8000",
  },