Docker环境下修改Vue.js应用默认端口失败的问题求助

Let's cut to the chase—your EXPOSE directive isn't working because it only declares which port the container uses, it doesn't actually configure the service inside the container to listen on that port. Here's the fastest fix for both your setups:

1. For the http-server Setup #

The http-server defaults to 8080 unless you explicitly tell it otherwise. Just add the -p flag to your CMD command to specify your desired port:

Update your Dockerfile like this:

FROM node:lts-alpine
RUN npm install -g http-server
WORKDIR /app
COPY package*.json ./
RUN npm install
COPY . .
RUN npm run build
# Declare the port you're actually using
EXPOSE 6969
# Tell http-server to listen on 6969 instead of 8080
CMD [ "http-server", "dist", "-p", "6969" ]

Then adjust your docker-compose.yml ports mapping to match:

ports:
  - "6969:6969"

Check your container logs afterward—you'll see http-server now listening on 6969, and your app should load without issues.

2. For the Nginx Setup #

Nginx defaults to port 80. The quickest way to change this is to modify its default config directly in the Dockerfile:

Update the production-stage section of your Dockerfile:

# production stage
FROM nginx:stable-alpine as production-stage
COPY --from=build-stage /app/dist /usr/share/nginx/html
# Replace the default listen port (80) with your desired port
RUN sed -i 's/listen 80;/listen 6969;/g' /etc/nginx/conf.d/default.conf
# Declare the new port
EXPOSE 6969
CMD ["nginx", "-g", "daemon off;"]

Then update your docker-compose.yml ports to:

ports:
  - "6969:6969"

Quick Note About the crbug/1173575 Error #

That warning is a Chrome-specific quirk, not related to your port configuration. It's just telling you that non-JS module files are deprecated, but it won't break your app—you can safely ignore it.

内容的提问来源于stack exchange，提问作者FMR