Dockerize Vue.js App — Vue.js | docker image vue
SimpleExampleSoyoubuiltyourfirstVue.jsappusingtheamazingVue.jswebpacktemplate[1]andnowyoureallywanttoshowoffwithyourcolleaguesbydemonstratingthatyoucanalsorunitinaDockercontainer.Let’sstartbycreatingaDockerfileintherootfolderofourproject:FROMnode:lts-alpine#installsimplehttpserverforservingstaticcontentRUNnpminstall-ghttp-server#maketheappfolderthecurrentworkingdirectoryWORKDIR/app#copybothpackage.jsonandpackage-lock.json(ifavailable)COPYpackage*.json./#installprojectdependenciesRUNnpminstal...
Simple ExampleSo you built your first Vue.js app using the amazing Vue.js webpack template[1] and now you really want to show off with your colleagues by demonstrating that you can also run it in a Docker container.
Let’s start by creating a Dockerfile in the root folder of our project:
FROM node:lts-alpine# install simple http server for serving static contentRUN npm install -g http-server
# make the app folder the current working directoryWORKDIR /app
# copy both package.json and package-lock.json (if available)COPY package*.json ./
# install project dependenciesRUN npm install
# copy project files and folders to the current working directory (i.e. app folder)COPY . .
# build app for production with minificationRUN npm run build
EXPOSE 8080CMD [ "http-server", "dist" ]
It may seem redundant to first copy package.json and package-lock.json and then all project files and folders in two separate steps but ther...