Vue-cli 通过scp2自动部署项目至服务器

本教程讲解的是 Vue-cli 脚手架搭建的vue项目, 利用scp2自动化部署到服务器上去

一 安装scp2

npm install scp2 --save-dev

二、配置测试/生产环境 服务器SSH远程登陆账号信息,在项目中新建deploy文件夹添加文件index.js及products.js

1. index.js

const scpClient = require("scp2");
const ora = require("ora");
const chalk = require("chalk");
const server = require("./products");
const spinner = ora(chalk.green("正在发布到" + server.name + "服务器..."));

 spinner.start();
        scpClient.scp(
          "dist/",
          {
            host: server.host,
            port: server.port,
            username: server.username,
            password: server.password,
            path: server.path,
          },
          function(err) {
            spinner.stop();
            if (err) {
              console.log(chalk.red("发布失败" + server.name + "服务器! \n"));
              console.log(chalk.red("err", err));
            } else {
              console.log(
                chalk.green("成功发布到" + server.name + "服务器! \n")
              );
            }
          }
        );

2. products.js

/*
 *定义多个服务器账号 及 根据 SERVER_ID 导出当前环境服务器账号
 */
const env = process.env.NODE_ENV;
let serverConfig = {};
switch (env) {
  case "dev":
    serverConfig = {
      name: "开发环境",
      host: "192.168.102.232", // ip
      port: 22, // 端口
      username: "2222", // 登录服务器的账号
      password: "32333", // 登录服务器的账号
      path: "/home/1111" // 发布至静态服务器的项目路径
    };
    break;
  case "test":
    serverConfig = {
      name: "测试环境",
      host: "192.168.102.218", // ip
      port: 22, // 端口
      username: "2222", // 登录服务器的账号
      password: "32333", // 登录服务器的账号
      path: "/home/1111" // 发布至静态服务器的项目路径
    };
    break;
}

module.exports = serverConfig;

三、package.json 配置 scripts 命令, 定义名称为 “deploy”

"deploy:dev": "npm run build:dev && cross-env NODE_ENV=dev node ./deploy",
"deploy:test": "npm run build:test && cross-env NODE_ENV=test node ./deploy"