菜单
菜单
文章目录
  1. pull node
  2. 配置两个 Docker 配置文件
    1. Dockerfile
    2. docker-compose.yml
  3. 修改 Vue 项目中的 HOST
  4. 启动

Docker 运行 Vuejs

作为 Docker 新手,总该为自己做一些入门笔记,毕竟还不熟悉,打开自己的笔记就可以立马部署了。

现在再来讲一下 Docker 运行 Vuejs 项目的方法。

pull node

将最新版的 docker with node 环境拉下来

1
docker pull node

配置两个 Docker 配置文件

Dockerfile

无论 npm 有没配置国内源, npm install 过程中都需要下载烦人的 chromedriver,而它又无法通过国内源,所以建议在本地通过代理 npm install 后,将整个项目 ADD 到容器里去。

1
2
3
4
FROM node:8
RUN mkdir /code
WORKDIR /code
ADD . /code/

docker-compose.yml

1
2
3
4
5
6
7
8
9
version: "3"
services:
web:
build: .
command: "npm run dev"
volumes:
- .:/code
ports:
- "8080:8080"

修改 Vue 项目中的 HOST

默认情况下,启动 npm run dev 的地址为 localhost:8080,而这种情况通过端口映射对于容器外的网络是不起作用的,必须将 HOST 改为 0.0.0.0

修改 build/webpack.dev.conf.js 文件中的 HOST

1
2
/* const HOST = process.env.HSOT */
const HOST = "0.0.0.0"

启动

执行 docker-compose up -d 命令启动程序。

-d 表示在作为后台执行。

当然在生产环境中使用 npm run dev 是不严谨的,暂时还没开发完成,后续将 build 后的方法再记录一下。

支持一下
扫一扫,支持我
  • 微信扫一扫
  • 支付宝扫一扫