21、Jenkins部署Vue应用

21、Jenkins部署Vue应用

1、将我们的项目上传到Git仓库

2、Jenkins安装NodeJS插件

3、Jenkins配置NodeJS

5、新建构建任务

my-vue-app

6、代码拉取

7、构建环境

8、构建项目

9、构建一次

10、打包

node -v
yarn -v
yarn install
yarn build

11、打包后的文件复制到Nginx静态文件目录

node -v
yarn -v
yarn install
yarn build

pwd

# 拷贝 dist 到 nginx
rm -rf /usr/share/nginx/html/*
cp -r dist/* /usr/share/nginx/html/

会报没有权限

1、解决方式一

# 使用root账号授权
chown -R jenkins:jenkins /usr/share/nginx/html

2、解决方式二

修改Nginx的代理目录

/var/lib/jenkins/workspace/my-vue-app/dist

sudo systemctl reload nginx

node -v
yarn -v
yarn install
yarn build

pwd

# 拷贝 dist 到 nginx
# rm -rf /usr/share/nginx/html/*
# cp -r dist/* /usr/share/nginx/html/