Vue-cli: Injecting information about port mapping (docker) to CLI

[cmath10]

What problem does this feature solve?

Inside docker container, CLI generates a message like:

It seems you are running Vue CLI inside a container.
Access the dev server via http://localhost:/

I propose to add configuration settings for this to force CLI to generate a correct external link instead of the message above.

https://stackoverflow.com/questions/57752780/how-to-change-vue-cli-message-after-successfull-compile-app-running-at

What does the proposed API look like?

Something like

module.exports = {
// ...
externalPort: 1234,
// ...
}

Or maybe it is possible to use some CLI hooks, to affect the final message, currently not able to find an appropriate option.

[LinusBorg]

The external port is set in your docker config / command, so vue cli can't influence that.

AFAIK it's also impossible from within a docker container to get info about which internal ports are mapped to which external ports.

[cmath10]

it's also impossible from within a docker container to get info about which internal ports are mapped to which external ports.

Not correct information, actually. You could set up your container's environment variables, for example, via docker-compose: https://docs.docker.com/compose/environment-variables/, and you could set up any values you want.

I do not need to affect my docker config/command. The thing I only wanted to change - _is only CLI message_ after successful compile. My team members use the links this message shows to access SPA in a browser directly from the IDE terminal. This a convenient feature, which we wanna use further, and trying to setup CLI to show the correct link, using data injected via environment variables defined via docker-compose.

Fragment from my docker-compose.yml:

    environment:
      UID: ${uid}
      GID: ${gid}
      PORT_WEBPACK: ${port_webpack}
      PORT_SANDBOX: ${port_sandbox}
      PORT_KARMA: ${port_karma}
    ports:
      - "${port_webpack}:8080"
      - "${port_sandbox}:8081"
      - "${port_karma}:9876"

I open my container, then echo $PORT_WEBPACK, for example, gets 4180 if this port was specified for 8080 in up command.

My team already uses information about mapping for KarmaJS, it generates links, used for testing in browser capture mode. For example, we use that feature for testing our app under IE from VirtualBox on Ubuntu.

[cmath10]

I'd like to use something similar to

module.exports = {
// ...
externalPort: process.env.PORT_WEBPACK
// ...
}

or some CLI hook, where I could be able to determine the whole message text.

[LinusBorg]

Thanks for the additional information, now I understand what you actually want - juts change the message text.

Iniitially It sounded to me like you expected Vue CLI to set this port or automacigally detect it. The additional examples made it clearer.