6.3 前端项目容器化
任务一：node-bulletin-board 项目
Node.js是一个基于Chrome V8引擎的JavaScript运行环境，让开发者可以使用JavaScript编写服务器端代码。它使JavaScript从浏览器扩展到了服务器，为前端开发提供了完整的工具链支持。
npm（Node Package Manager）是Node.js的默认包管理工具，用于安装、共享和管理JavaScript代码包。它维护着世界上最大的开源代码库，开发者可以通过简单的命令安装和使用成千上万的第三方库。
package.json是Node.js项目的核心配置文件，记录项目的元数据和依赖关系。它定义了项目所需的各种依赖包及其版本，包含启动、测试、构建等脚本命令，是前端项目容器化过程中的关键文件，容器通常会根据它安装依赖并执行相应的构建命令。
1、准备项目
node-bulletin-board 是一个使用 JavaScript 语言构建的项目，执行以下命令使用 git 工具将该项目下载到本地：
git clone https://git.seahi.me/docker/node-bulletin-board2、进入到该项目中
cd node-bulletin-board/bulletin-board-app创建 Dockerfile 内容如下：
FROM node:6.11.5
WORKDIR /app
COPY package.json .
RUN npm install
COPY . .
CMD [ "node", "server.js" ]- 保持
Dockerfile不动，修改index.html后构建（统计时间） - 合并
COPY，再次修改index.html后构建（统计时间）
3、构建镜像
执行以下命令构建Docker镜像：
docker build -t bulletin-board:1.0 .
4、启动容器并验证
执行以下命令启动容器：
docker run --name bulletin-board -p 8000:8080 --rm bulletin-board:1.0打开浏览器访问 http://localhost:8000：
任务二：pacman 项目
1、准备项目
执行以下命令克隆Pacman游戏项目：
git clone https://git.seahi.me/docker/pacman2、编写 Dockerfile
进入项目目录，创建 Dockerfile 文件并添加以下内容：
FROM nginx:alpine
COPY . /usr/share/nginx/htmlFROM nginx:alpine- 使用轻量级的nginx镜像作为基础镜像，alpine版本体积更小COPY . /usr/share/nginx/html- 将当前目录下的所有文件复制到nginx的默认网站目录
3、构建并运行容器
执行以下命令构建镜像：
docker build -t pacman:1.0 .运行容器：
docker run --name pacman -p 8080:80 --rm pacman:1.0在浏览器中打开 http://localhost:8080 查看游戏：
作业
Vue项目地址：https://git.seahi.me/docker/my-vue-app
1、编写一个Dockerfile，将该Vue应用容器化，要求：
- 使用多阶段构建
- 第一阶段编译Vue应用
- 第二阶段使用nginx部署
一阶段： 基础镜像：node:alpine 工作目录：/build 执行 npm install 和 npm run build build 结果：会在 /build/dist 目录生成静态网页
2、构建并运行容器，验证应用是否正常工作
npm run build 命令将编译后的Vue项目存储在当前目录中的 dist 目录中！
2、参考上节课的分阶段构建和本节课的任务二。
