前端自動化部署

在常規的前端項目中,部署項目需要經過本地build,壓縮文件,將壓縮包上傳至服務器并解壓文件等步驟,過程較為繁瑣。所以本人編寫了一個nodejs腳本,用來告別手動上傳的過程,配置使用簡單,實現前端一鍵自動化部署。

前端自動化編譯與部署腳本
當前支持window上傳至linux服務器以及linux上傳至linux服務器
如果您覺得對您有幫助 點個贊或者去GitHub點個star ,非常感謝
項目git地址

使用步驟

1.下載項目,git clone https://github.com/HEJIN2016/auto-deploy.git
將項目中autoDeploy.js文件拷貝至前端項目根目錄下(與前端打包完之后的dist目錄同級)

2.安裝依賴:

 npm install archiver ssh2 -D

3.配置前端工程部署服務器用戶密碼等
在autoDeploy.js中,找到首行的對象Config,配置相關參數,配置如下

const Config = {
  host: 'test.com', // 服務器ip地址或域名
  port: 22, // 服務器ssh連接端口號
  username: 'root', // ssh登錄用戶
  password: '', // 密碼
  // privateKey: fs.readFileSync('myKey.key'), // 私鑰,私鑰與密碼二選一

  catalog: '/var/www/test', // 前端文件壓縮目錄,請勿以/符號結尾
  buildDist: 'dist', // 前端文件打包之后的目錄,默認dist
  buildCommand: 'npm run build', // 打包前端文件的命令,默認為npm run build
  readyTimeout: 20000 // ssh連接超時時間
};

4.執行上傳命令
node autoDeploy.js,耐心等待部署完畢,建議將node autoDeploy.js命令添加進入package.json中

部署基本流程介紹

1.執行build命令
2.壓縮打包之后的文件

// 創建文件輸出流
      let output = fs.createWriteStream(__dirname + '/' + fileName);
      let archive = archiver('zip', {
        zlib: { level: 9 } // 設置壓縮級別
      });
      // 文件輸出流結束
      output.on('close', function() {
        console.log(`----壓縮文件總共 ${archive.pointer()} 字節----`);
        console.log('----壓縮文件夾完畢----');
        resolve({
          success: true
        })
      });
      // 數據源是否耗盡
      output.on('end', function() {
        console.error('----壓縮失敗,數據源已耗盡----');
        reject();
      });
      // 存檔警告
      archive.on('warning', function(err) {
        if (err.code === 'ENOENT') {
          console.error('----stat故障和其他非阻塞錯誤----')
        } else {
          console.error('----壓縮失敗----');
        }
        reject(err);
      });
      // 存檔出錯
      archive.on('error', function(err) {
        console.error('----存檔錯誤,壓縮失敗----');
        console.error(err);
        reject(err);
      });
      // 通過管道方法將輸出流存檔到文件
      archive.pipe(output);

      // 打包dist里面的所有文件和目錄
      archive.directory(filePath, false);
      // archive.directory(`../${Config.buildDist}/`, false);

      // 完成歸檔
      archive.finalize();

3.ssh連接服務器并上傳文件
4.解壓上傳的文件
5.刪除本地的壓縮包文件,部署完畢

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。