如何创建一个JavaScript docker镜像

源码：fhsinchy/hello-dock

这是一个非常简单的 JavaScript 项目。

创建一个 Dockerfile

FROM node:14.15.4-alpine3.12
EXPOSE 3000
USER node
RUN mkdir /home/node/app
WORKDIR /home/node/app
COPY ./package.json .
RUN npm install

COPY . .

CMD ["npm", "start"]

对以上文件进行解释：

• FROM：指定基础镜像，这里使用的是 node:14.15.4-alpine3.12，这是一个非常小的镜像，只有 88.9MB。
• EXPOSE：指定端口，这里指定的是 3000 端口。
• USER：指定用户，这里指定的是 node。
• RUN：执行命令，这里执行的是 mkdir /home/node/app。
• WORKDIR：指定工作目录，这里指定的是 /home/node/app。
• COPY：复制文件，这里复制的是 package.json。
• RUN：执行命令，这里执行的是 npm install。
• COPY：复制文件，这里复制的是 .，也就是当前目录下的所有文件。
• CMD：指定命令，这里指定的是 npm start。

构建镜像

docker build -t hello-dock .

--file选项可以指定 Dockerfile 的路径，-t选项可以指定镜像的名称。

执行命令后可以访问 http://localhost:3000 查看效果。

挂载本地目录

docker run -it -p 3000:3000 -v $(pwd):/home/node/app hello-dock

-v选项可以挂载本地目录，这里挂载的是当前目录，也就是 .。

挂载本地目录后，修改本地文件后，可以直接在浏览器中查看效果。

使用匿名卷

docker run -it -p 3000:3000 -v /home/node/app/node_modules -v $(pwd):/home/node/app hello-dock

多阶段构建

FROM node:lts-alpine as builder

WORKDIR /app

COPY ./package.json ./
RUN npm install

COPY . .
RUN npm run build

FROM nginx:stable-alpine

EXPOSE 80

COPY --from=builder /app/dist /usr/share/nginx/html

多阶段构建和单阶段构建的区别在于，多阶段构建可以减少镜像的大小。

• 第一阶段：安装依赖，构建项目。
• 第二阶段：使用 Nginx 镜像，将第一阶段构建的项目复制到 Nginx 的目录下。

构建镜像后，可以访问 http://localhost:8080 查看效果。

多阶段构建适用于前端项目，因为前端项目的构建过程比较复杂，需要安装很多依赖，构建完成后，只需要将构建后的文件复制到 Nginx 的目录下即可。

忽略不需要的文件

.git
*Dockerfile*
*docker-compose*
node_modules