FTP 自动部署

如果你的团队没有给测试服部署 CI/CD 方案，而是只准备了 SFTP，那么可以考虑使用本方案。

核心软件

使用ftp-deploy即可。

安装 ftp-deploy

yarn add -D ftp-deploy

根据说明文档，在项目根目录创建ftp-deploy.js编写配置文件。
在package.json加入"deploy": "node ./bin/ftp-deploy.js",，也可以跟在build的后面用&&连接。

编写上传任务

上传任务必须分为 2 步：

必须先上传/static/，这些文件带有 Hash，不会覆盖不同的文件。是完全无风险操作。
再上传/static/外的其他文件。

这样保证新的index.html生效时，其引用的文件也都已经生效。为达成此目的，你必须制定 2 个上传任务，依次执行。

范例如下：

const path = require('path');
const child_process = require('child_process');
const FtpDeploy = require('ftp-deploy');
const ftpDeploy = new FtpDeploy();

const baseConfig = {
  host: '??.??.??.??',
  user: '??????',
  password: '??????',
  port: 22, // SFTP 的默认端口是 22
  localRoot: __dirname + '/dist',
  remoteRoot: '/data/item/vue/sxyd_web',
  forcePasv: true,
  sftp: true,
  deleteRemote: false, // 必须为false
};

const AllFilesExceptIndexHtmlConfig = { ...baseConfig, include: ['static/**/*'] };
const IndexHtmlConfig = {
  ...baseConfig,
  include: ['*', '**/*'],
  exclude: ['static/**/*'],
};

console.log('Start uploading...');
ftpDeploy
  .deploy(AllFilesExceptIndexHtmlConfig)
  .then((res) => console.log('Static dir finished:', res))
  .then(() => {
    return ftpDeploy.deploy(IndexHtmlConfig);
  })
  .then((res) => console.log('Others finished:', res))
  .then(() => {
    const vbsPath = path.join(__dirname, 'ftp-deploy.vbs');
    child_process.exec(
      'cscript.exe ' + vbsPath + ' "提示" "SFTP部署完成"',
      function (err, stdout, stderr) {
        //...
      }
    );
  })
  .catch((err) => console.log(err));

FTP 自动部署 #

核心软件 #

编写上传任务 #

FTP 自动部署

核心软件

编写上传任务