VUE app change dev server from localhost:8080 to my-testing-web-address.com

Question

I have a VUE application and I need to run it on an external link not on localhost.

I tried to create a

vue.config.js

devServer: {
    host: 'http://my-testing-web-address.com',
    port: 8080,
    ...
}

and set the devserver, but still no changes

when I run

npm run serve

It says

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

It's any way to set up an external devserver?

Convexoconcave

did you npm run build? – Echo

yes and for npm run build it's ok, but I need to have the devserver running on the same url, because I'm doing the design changes and if I'll run build every time, a lot of time will be waste. – Convexoconcave

Is this for showing changes to your client who is viewing externally? – Brooking

the company's policy is to work directly on the server, so the project need to be develop not locally, but remote... – Convexoconcave

Answer 1

{
  module.exports = {
    devServer: {
      host: 'projectname.local'
    }
  }
}

Full details here: https://stevencotterill.com/snippets/vue-cli-using-a-custom-domain

Nutbrown

Answer 2

In vue.config.js:

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

Intelligencer

Currently disableHostCheck does not seem to "exist" while using Vue "^2.7.14". Thank You anyway, I think it helped me discover the solution I presented. – Alvaalvan

Answer 3

For me adding the similar entry to module.exports in "vue.config.js" helped:

devServer: {
  allowedHosts: ['(...).tunnelmole.com']
}

Alvaalvan

Answer 4

Never use the ending ".com" in a test urlI recommend using your-domain.test with the ending ".test"

See the correct configuration, how it should look:

into vue.config.js

const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
transpileDependencies: true,
devServer: {
host: 'vue-custom-domain.test',
client: {
  webSocketURL: 'ws://vue-custom-domain.test:8080/ws',
},
  }
})

More info in: https://www.conteudopertinente.com.br/vue3/vue-change-url-from-localhost8080-to-custom-domain/

Mcewen