步骤7：增加前端启动命令，简化流程

1.增加前端启动命令

为什么要加上前端的启动命令呢？
我们分析一下：前端代码改动后我们会进行下面几步操作：

1. git pull 拉取最新代码
2. yarn build或者npm run build，进行打包
3. 停止原来的nginx容器，启动新的nginx容器（除了第一次启动时外，非必须）

git pull

yarn --registry=https://registry.npm.taobao.org/ && yarn build

#删除容器
docker rm -f demo1 &> /dev/null

#启动容器
docker run -d --restart=on-failure:5\
    -p 8080:80 \
    -v $PWD/dist:/usr/share/nginx/html \
    --name demo1 nginx

这样的话 我们可以将这些操作合并在一个sh文件(linux中的)中，以后可能会有更多的命令，都可以放在一起

2.根目录新增文件start.sh，如图，内容见上方

image.png

并随意修改App.vue，使其待会可以判断重启成功

image.png

3.提交代码到git后，服务器git pull拉下来最新代码

image.png

4. 执行启动脚本

$ sh start.sh

image.png

打开页面 即可看到页面发生了变化

image.png

end

这里简单实用了linux中的sh脚本代替我们频繁重启中额外的操作