Abhay Gupta
Abhay Gupta

Reputation: 826

Run rsync on every save in VSCode

I have a repository on my local system and am testing my changes on a remote server. I am using VSCode for development. I want that on every save, rsync should run in background and sync the changes in the current local file with remote. How can I achieve this with VSCode?

Upvotes: 7

Views: 11092

Answers (4)

Animesh D
Animesh D

Reputation: 5002

For deploying my blog locally I used rsync to copy an out/ directory into /var/www/

I used vscode tasks as this deployment step depends on a build step. Notice that the dependsOn property is set to the build step my-build.

{
    "version": "2.0.0",
    "tasks": [
        {
            "label": "my-build",
            "command": "buildcmd",
            "type": "shell",
            "args": [
                "build",
                "-O",
                "out"
            ],
            "group": {
                "kind": "build",
                "isDefault": true
            },
            "presentation": {
                "close": true
            }
        },
        {
            "label": "deploy",
            "command": "rsync",
            "type": "shell",
            "args": [
                "-a",
                "out/",
                "/var/www/mysite/"
            ],
            "group": {
                "kind": "build",
                "isDefault": true
            },
            "presentation": {
                "close": true
            },
            "dependsOn": [
                "my-build"
            ]
        }
    ]
}

Note: buildcmd is just an alias for a static site generator I use.

Upvotes: 0

Abhay Gupta
Abhay Gupta

Reputation: 826

I am using Save and Run vscode extension for syncing code between local and remote server whenever I hit save in VSCode. Following is the configuration I am using.

"saveAndRun": {
  "commands": [
    {
      "match": ".*",
      "cmd": "rsync -av --no-owner ${file} {destination folder}${relativeFile}",
      "useShortcut": false,
      "silent": false
    },
  ]
}

The output generated when the rsync command is run can been seen in VSCode terminal. You can add the above configuration in .vscode/settings.json file. You can learn more about editing settings.json file here

Upvotes: 9

JW.
JW.

Reputation: 51668

The Sync-Rsync extension is designed to do this.

Upvotes: 2

RockBoro
RockBoro

Reputation: 2473

Here is extension code which uses the onDidSaveTextDocument event to run code after a file is saved. The code uses the exec function of the child_process package to run a command. In this case, it launches the chrome browser.

import * as vscode from 'vscode';
import * as path from 'path';

import * as cp from 'child_process';

export function activate(context: vscode.ExtensionContext)
{
    vscode.workspace.onDidSaveTextDocument((d) =>
    {
        vscode.window.showInformationMessage("Document saved:" + path.basename(d.fileName));

        const start = (process.platform == 'darwin' ? 'open' : process.platform == 'win32' ? 'start' : 'xdg-open');
        cp.exec(start + ' chrome ' );
    });
}

Upvotes: 1

Related Questions