Docker如何運(yùn)行Vue項(xiàng)目

本篇內(nèi)容主要講解“Docker如何運(yùn)行Vue項(xiàng)目”，感興趣的朋友不妨來看看。本文介紹的方法操作簡單快捷，實(shí)用性強(qiáng)。下面就讓小編來帶大家學(xué)習(xí)“Docker如何運(yùn)行Vue項(xiàng)目”吧!

    本人非前端，只是為了部署才。Dockfile的內(nèi)容主要來源于Vue官方:https://cn.vuejs.org/v2/cookbook/dockerize-vuejs-app.html

    直接上Dockerfile吧，和官方的幾乎一樣，但細(xì)節(jié)上面做了配置，更貼近實(shí)際使用。詳情請看Dockerfile內(nèi)容：

FROM node:lts-alpine
# 如果你在國內(nèi)，這行配置很有必要，不然打包會非常非常慢，原因嘛，都懂。
RUN npm config set registry https://registry.npm.taobao.org
# install simple http server for serving static content
RUN npm install -g http-server

# make the 'app' folder the current working directory
WORKDIR /app

# copy both 'package.json' and 'package-lock.json' (if available)
COPY package*.json ./

# install project dependencies
RUN npm install

# copy project files and folders to the current working directory (i.e. 'app' folder)
COPY . .

# build app for production with minification
RUN npm run build:prod

EXPOSE 9000
# 加入端口自定義配置，避免與其他K8S容器端口沖突
CMD [ "http-server","-p","9000", "dist" ]

    構(gòu)建Docker鏡像：

docker build -t registry.cn-hangzhou.aliyuncs.com/xxx/xxx .

    測試鏡像可用性：

docker run -p 80:9000 --rm registry.cn-hangzhou.aliyuncs.com/xxx/xxx

到此，相信大家對“Docker如何運(yùn)行Vue項(xiàng)目”有了更深的了解，不妨來實(shí)際操作一番吧！這里是億速云網(wǎng)站，更多相關(guān)內(nèi)容可以進(jìn)入相關(guān)頻道進(jìn)行查詢，關(guān)注我們，繼續(xù)學(xué)習(xí)！