Guohui's Notes

VS Code

3 min read

Introduction

Visual Studio Code (VS Code) is a free, powerful, cross-platform code editor. With the LaTeX Workshop extension, it becomes an excellent LaTeX editing environment with live preview, autocomplete, and integrated PDF viewing.

VS Code + LaTeX Workshop is the recommended editor for LaTeX. You also need to install a backend compiler to use LaTex. See LaTeX for installation of the TeX backend (TexLive).

Installation

In the following shortcuts, Cmd denotes the Command key in MacOS and should be replaced by the Control key in Windows.

VS Code

  1. Download from https://code.visualstudio.com/

  2. Install the application

  3. (Optional but recommended) Install the command-line tool to open files from terminal with code:

    There are two ways to install the code command:

    Option 1: During installation

    • Ensure the checkbox “Add to PATH (requires shell restart)” is selected during the VS Code installation wizard

    Option 2: From within VS Code (if already installed)

    1. Launch VS Code
    2. Open the Command Palette: Press Cmd + Shift + P
    3. Type “shell command”
    4. Select Shell Command: Install ‘code’ command in PATH from the list
    5. Restart Terminal: Close any open terminal windows and reopen them for the changes to take effect
    6. Verify: Type code --version in your terminal to confirm the installation

Extensions

  1. Open VS Code
  2. Go to Extensions view:
    • Location: Click the Extensions icon in the Activity Bar (the leftmost vertical sidebar)
    • Icon appearance: The icon looks like four squares connected in a 2×2 grid pattern (like a puzzle piece).
    • Keyboard shortcut: Press Cmd+Shift+X (or Ctrl+Shift+X on Windows/Linux)
  3. Search for the name of extensions such as
    • “LaTeX Workshop” (by James Yu)
    • “Markdown All in One (by Yu Zhang)”
    • “Github Copilot Chat”
  4. Click Install

Configuration

After installation, LaTeX Workshop should work with sensible defaults. For customization:

  1. Open Settings (Cmd+, or click the setting icon at the bottom of the activity bar)
  2. Search for “latex workshop”
  3. You could find many settings there.

You could change the settings of other extensions similarly.

LaTeX Usage

Compile and Preview

  1. Open your existing .tex file or create a new one
  2. Compile it: click the Build(a triangle) button on the top right of the tex file
  3. Preview the .pdf file: click the View Latex PDF button next to the Build button

AutoCompile (Recommended)

LaTeX Workshop can automatically compile it when you save the tex file:

  1. Go to Settings (the button at the bottom left corner of VS Code) → search “latex workshop auto build run”
  2. Select the option onSave

When you use Cmd+S or File->Save to save the tex file, it will compile the pdf file automatically.

AutoCompile is convenient for iterative editing but may cause brief lag on large documents.

Forward/Backward SyncTeX

  • Forward: Right-click in tex file→ “SyncTeX from cursor” → jumps to corresponding PDF
  • Backward: Cmd+Click on text in PDF → jumps to Tex location.

    You could change it from Cmd+Click to Double Click in Settings (search latexworkshop pdf synctex keybinding in settings).

Common Commands (Command Palette Cmd+Shift+P or Click the TeX icon in activity bar)

  • LaTeX Workshop: Build — Compile manually
  • LaTeX Workshop: Clean — Delete auxiliary files
  • LaTeX Workshop: View PDF — Open PDF without building
  • LaTeX Workshop: SyncTex from PDF — Start reverse search

Markdown Usage

Preview

  1. Open an existing .md file or create a new one (check Markdown for the basic syntax)
  2. Preview: click the button Open Preview to the Side on the top right corner of the .md file

Export

  • Cmd+Shift+P → “Print current document to HTML” to export an .html file

Graph View

Backlinks