Jekins上部署前端环境

绝地灬酷狼 2024-04-18 16:16 86阅读 0赞

## 安装Node ##

**（1）创建文件夹，下载解压node**

wget https://nodejs.org/dist/v10.15.0/node-v10.15.0-linux-x64.tar.xz    // 下载
    tar xf  node-v10.15.0-linux-x64.tar.xz       // 解压

**（2）找到修改/etc/profile文件**

vi  编辑 i 开启编辑模式   esc保存     shift+:wq
    export NODE_HOME=/usr/local/node  //Node所在路径
    export PATH=$NODE_HOME/bin:$PATH

**执行命令 source /etc/profile 及在当前控制台更新**

**（3）node -v 看是否安装成功**

## git配置 ##

**（1）生成，照提示完成三次回车 zzz@ziasset.com**

ssh-keygen -t rsa -f ~/.ssh/id_rsa_ziasset -C "zzz@ziasset.com"

**（2）公钥配置到git上**

**（3）配置 .ssh/config**

Host ziasset
    HostName library.ziasset.com
    User zzz
    Port 22022
    IdentityFile ~/.ssh/id_rsa_ziasset
    PreferredAuthentications publickey

**（4）拉取项目代码**

## 打包 ##

**（1）更新，install**

git pull
    npm install

**如果遇到报错**

# npm WARN ajv-keywords@3.2.0 requires a peer of ajv@^6.0.0 but none is installed
        # 手动安装ajv即可
        npm install ajv@^6.0.0
    # npm WARN fsevents@1.2.0 had bundled
        # mac下需要 fsevents，这里是在windows环境，所以可以忽略这个警告，对你没什么影响
    # Error: EACCES: permission denied, mkdir './node_modules/node-sass/.node
        npm install node-sass --unsafe-perm --save-dev
    npm run build  # 打包成功！

## 编写脚本 ##

#!/bin/bash
    # 参数验证
    if [ $# -ne 2 ];
    then
            echo '======>参数错误 $1:git项目名,$2:发布目录'
            echo '======>    eg: travelweb travel-web'
        exit
    fi
    Home=/opt/deploy/web
    #Project=travelweb
    Project=$1
    # 发布目录
    #Dir=travel-web
    Dir=$2
    
    cd $Home/$Project
    echo "进入 `pwd -P`"
    git pull
    NODE_HOME=/opt/node/node-v10.15.0-linux-x64
    export PATH=$PATH:$NODE_HOME/bin
    /opt/node/node-v10.15.0-linux-x64/bin/npm install
    rm -rf dist
    /opt/node/node-v10.15.0-linux-x64/bin/npm run build
    
    if [ $? -ne 0 ]; then
        echo "======> 打包失败 exit......"
            exit
    fi
    echo "======> 打包成功，开始发布到nginx"
    cp -rp dist/* /usr/local/webserver/nginx/html/$Dir

## jenkins 配置 ##

**（1）新建任务**  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0NhcnJpZV96eno_size_16_color_FFFFFF_t_70]  
**（2）构建自由风格的软件项目**  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0NhcnJpZV96eno_size_16_color_FFFFFF_t_70 1]  
**执行shell**

/opt/deploy/web/deploy-dev.sh 参数1 参数2
    参数1 ： git项目名称 
    参数2 ： 发布nginx目录名称

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0NhcnJpZV96eno_size_16_color_FFFFFF_t_70]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/18/4ae4333ac86647a3a25768d44bc0e5e2.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0NhcnJpZV96eno_size_16_color_FFFFFF_t_70 1]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/18/090aa2832bae494d9cdb72afc0e7d597.png