title: Can't access Dockerized Vue's localhost:8080 on host machine (despite EXPOSE-ing port)
body: <p>I can't access my Vue app on <code>localhost:8080</code> anymore after Dockerizing the app.</p>
  
  <p>I have a <code>Dockerfile</code> with the following contents:</p>
  
  <pre><code> # Base the image off of the NodeJS image
   FROM node
  
   # Set the working directory to be the HOME directory
   WORKDIR /root
  
   # Install NPM dependencies early in the build process
   COPY ./package.json /root
   COPY ./package-lock.json /root
   RUN npm install
  
   # Specify what port will be available - necessary for VPC network
   EXPOSE 8080
  
   # Copy our application files to the image
   COPY ./.browserslistrc /root
   COPY ./.eslintrc.js /root
   COPY ./.env /root
   COPY ./babel.config.js /root
   COPY ./README.md /root
   COPY ./vue.config.js /root
   COPY ./public /root/public
   COPY ./src /root/src
  
   # Start the container running our Node app
   CMD ["npm", "run", "serve"]
  </code></pre>
  
  <p>(Before Dockerizing, <code>npm run serve</code> allowed me to access the Vue app through my web browser.)</p>
  
  <p>Then I run the PS command <code>docker build</code>:</p>
  
  <pre><code>PS C:\Users\User\mealSocial-dev&gt; docker build -t finalvue app
  Sending build context to Docker daemon  126.8MB
  Step 1/15 : FROM node
   ---&gt; 448d0873ea84
  
  [...]
  
  Step 15/15 : CMD ["npm", "run", "serve", "--port", "\"8080\""]
   ---&gt; Running in c4840f98e5dc
  Removing intermediate container c4840f98e5dc
   ---&gt; 904928fa859c
  Successfully built 904928fa859c
  Successfully tagged finalvue:latest
  SECURITY WARNING: You are building a Docker image from Windows against a non-Windows Docker host. All files and directories added to build context will have '-rwxr-xr-x' permissions. It is recommended to double check and reset permissions for sensitive files and directories.
  </code></pre>
  
  <p>...Then <code>docker run -p 8080:8080</code>:</p>
  
  <pre><code>PS C:\Users\User\mealSocial-dev&gt; docker run -p 8080:8080 finalvue
  
  &gt; meal-app@0.1.0 serve /root
  &gt; vue-cli-service serve
  
   INFO  Starting development server...
  &lt;s&gt; [webpack.Progress] 0% compiling
  
  [...]
  
  DONE Compiled successfully in 8147ms11:39:59 AM
  &lt;s&gt; [webpack.Progress] 100%    
  App running at:    
  - Local: http://localhost:8080/    
  It seems you are running Vue CLI inside a container.    
  Access the dev server via http://localhost:&lt;your container's external mapped port&gt;/    
  Note that the development build is not optimized.   
  To create a production build, run npm run build.
  </code></pre>
  
  <p>Despite it saying <code>It seems you are running Vue CLI inside a container. Access the dev server via http://localhost:&lt;your container's external mapped port&gt;/</code>, I get <code>This page isn’t working. localhost didn’t send any data. ERR_EMPTY_RESPONSE</code>:
  <a href="https://i.stack.imgur.com/4LNas.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/4LNas.png" alt="enter image description here"></a></p>
  
  <p>I'm <code>EXPOSE</code>-ing the port in the <code>Dockerfile</code> and adding the <code>-p 8080:8080</code> tag when I run <code>docker run</code>. What am I missing?</p>