SoFunction
Updated on 2025-04-10

Example of method for Vue to automatically build publishing scripts

Introduction

Use cross-env and scp2 to complete

cross-env

cross-env is a script that runs cross-platform setup and use environment variables.

Why do you need cross-env?

NODE_ENV=production Most Windows command prompts block when setting environment variables like this. (Bash on Windows is the exception, which uses native Bash.) Similarly, the way Windows and POSIX commands use environment variables is different. For POSIX, you can use: $ENV_VAR and %ENV_VAR% on Windows.
cross-env so that you can use a single command without worrying about setting up or using environment variables correctly for the platform. Just like when running on a POSIX system, just set it up and cross-env will be set up properly.

scp2

scp2 is a pure JavaScript secure replication program based on ssh2. ssh2 is largely driven by ssh2, and scp is implemented in some sftp way.
It is written in pure JavaScript and can run on every OS, even Windows does. Nodejs (v0.8.7 or higher) must be used to make it work properly.

Install

Install in the project root directory with one click

cnpm install scp2 --save-dev
cnpm install cross-env --save-dev

Create a deploy folder in the root directory, create it in the deploy directory (code entry file), (configuration file and core code). The code is as follows


// deploy/ insideconst scpClient = require('scp2');
const ora = require('ora');
const chalk = require('chalk');
const server = require('./products');
const spinner = ora(
  'Publishing to' +
  (.NODE_ENV === 'prod' ? 'Production' : 'test') +
  'server...'
);

var Client = require('ssh2').Client;

var conn = new Client();
conn
  .on('ready', function() {
    // rm deletes dist file, \n is a new line, executes a new line, restart nginx command, I am using docker to restart nginx here    // rm -rf /mdm/nginx/dist\ndocker restart nginx
    ( `cp -r /home/newResource/dist/. /home/newResource/dist${new Date().toLocaleDateString().replace(/\//g,'-')} \nrm -rf /home/newResource/dist` , function(
      err,
      stream
    ) {
      if (err) throw err;
      stream
        .on('close', function(code, signal) {
          // After executing the shell command, put the code to start uploading and deploying the project here          ();
          (
            './dist', {
              host: ,
              port: ,
              username: ,
              password: ,
              path: 
            },
            function(err) {
              ();
              if (err) {
                (('Release failed.\n'));
                throw err;
              } else {
                (
                  (
                    'Success! posted to' +
                    (.NODE_ENV === 'prod' ?
                      'Production' :
                      'test') +
                    'Server! \n'
                  )
                );
              }
            }
          );

          ();
        })
        .on('data', function(data) {
          ('STDOUT: ' + data);
        })
        .('data', function(data) {
          ('STDERR: ' + data);
        });
    });
  })
  .connect({
    host: ,
    port: ,
    username: ,
    password: 
    //privateKey: require('fs').readFileSync('/home/admin/.ssh/id_dsa')
  });


/*
  *Read env environment variables
  */
const fs = require('fs');
const path = require('path');
// env file determines the corresponding server id of the packaging environmentconst envfile = .NODE_ENV === 'prod' ? '../.' : '../.';
// Path of env environment variableconst envPath = (__dirname, envfile);
// env objectconst envObj = parse((envPath, 'utf8'));
const SERVER_ID = parseInt(envObj['VUE_APP_SERVER_ID']);

function parse(src) {
  // parse the file with KEY=VAL  const res = {};
  ('\n').forEach(line => {
    // matching "KEY' and 'VAL' in 'KEY=VAL'
    // eslint-disable-next-line no-useless-escape
    const keyValueArr = (/^\s*([\w\.\-]+)\s*=\s*(.*)?\s*$/);
    // matched?
    if (keyValueArr != null) {
      const key = keyValueArr[1];
      let value = keyValueArr[2] || '';

      // expand newlines in quoted values
      const len = value ?  : 0;
      if (len > 0 && (0) === '"' && (len - 1) === '"') {
        value = (/\\n/gm, '\n');
      }

      // remove any surrounding quotes and extra spaces
      value = (/(^['"]|['"]$)/g, '').trim();

      res[key] = value;
    }
  });
  return res;
}

/*
  *Define multiple server accounts and export the current environment server account according to SERVER_ID
  */
const SERVER_LIST = [{
    id: 0,
    name: 'A-Production Environment',
    domain: '', // Domain name    host: '', // ip
    port: 22, // Port    username: 'root', //Login the server's account    password: 'root', //Login the server's account    path: '/mdm/nginx/dist' // The project path published to the static server  },
  {
    id: 1,
    name: 'B-Test Environment',
    domain: '',
    host: '',
    port: 22,
    username: 'root',
    password: 'root',
    path: '/home/newResource/dist'
  }
];

 = SERVER_LIST[SERVER_ID];

Create an environment configuration file

. (Development Environment)

VUE_APP_SERVER_ID=1

. (Formal environment)

VUE_APP_SERVER_ID=0

File configuration startup item

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

Execute the command

npm run deploy:dev

You can directly package and compile and publish to the server

refer to:https:///article/

This is the end of this article about the example method of Vue automatically constructing and publishing scripts. For more related contents of Vue automatically constructing and publishing scripts, please search for my previous articles or continue browsing the related articles below. I hope everyone will support me in the future!