How to Change Views in Visual Studio Code: A Guide

Restoring Visual Studio Code's Previous File View

Using the Visual Studio Code API and JavaScript

// This script uses the Visual Studio Code API to toggle between the changes view
// and the original file view for the currently open file.

const vscode = require('vscode');

function activate(context) {
  let disposable = vscode.commands.registerCommand('extension.toggleFileView', function () {
    const editor = vscode.window.activeTextEditor;
    if (editor) {
      const uri = editor.document.uri;
      const gitUri = uri.with({ scheme: 'git', query: 'diff' });

      vscode.workspace.openTextDocument(gitUri).then(doc => {
        vscode.window.showTextDocument(doc, { preview: true });
      }).catch(err => {
        vscode.workspace.openTextDocument(uri).then(doc => {
          vscode.window.showTextDocument(doc, { preview: true });
        });
      });
    }
  });

  context.subscriptions.push(disposable);
}

function deactivate() {}

module.exports = {
  activate,
  deactivate
};

Effectively Flip Between File Views

Python and the VS Code API

# This script uses the Visual Studio Code API via a Python extension to toggle
# between the changes view and the original file view for the currently open file.

import vscode

def activate(context):
    def toggle_file_view():
        editor = vscode.window.active_text_editor
        if editor:
            uri = editor.document.uri
            git_uri = uri.with_(scheme='git', query='diff')

            try:
                vscode.workspace.open_text_document(git_uri).then(lambda doc: vscode.window.show_text_document(doc, preview=True))
            except:
                vscode.workspace.open_text_document(uri).then(lambda doc: vscode.window.show_text_document(doc, preview=True))

    context.subscriptions.append(vscode.commands.register_command('extension.toggleFileView', toggle_file_view))

Frequently Asked Questions and Answers for VS Code File Views

1. How can I use Git: Open Changes and then access the original file?
2. The original file view can be accessed by using an extension such as "GitLens" or by creating a custom command.
3. How can I open the current file in Git diff view with this command?
4. With the URI changed to include scheme: 'git' and query: 'diff', the command is vscode.window.showTextDocument.
5. Can I change the keyboard shortcuts in VS Code that flip between views?
6. Indeed, you can build up shortcuts for changing between views by customizing keybindings in the settings.
7. Exists an extension that makes it easier to see changes to files?
8. Yes, there are a lot of options available for managing and viewing file changes in extensions like "GitLens".
9. How can I go back to the way the file was displayed without having to quit the editor?
10. Toggle the view automatically with a script or manually with the file explorer.
11. Why is vscode.workspace.openTextDocument used?
12. This command allows you to see and edit a text document by opening it in the workspace.
13. How can I make sure commands in an extension are properly cleaned up?
14. You may make sure commands are appropriately disposed of when the extension is deactivated by adding them to context.subscriptions.push.
15. Is it possible to view the updates for several files at once?
16. Sure, you can use split views or open several editors to view changes to numerous files at once.
17. How come the diff view won't open with the updated URI?
18. This issue can be detected by the script, which will then open the original file URI.