#Office Viewer

English | 简体中文 | 繁體中文

##Introduction

This extension lets you preview and edit common office and design files directly in VS Code.

• ›Excel: .xls, .xlsx, .xlsm, .csv, .ods
• ›Word: .docx, .dotx
• ›PowerPoint: .pptx, .pptm
• ›PDF & eBook: .pdf, .epub
• ›HEIC/TIFF: .heic, .heif, .tiff
• ›Design: .psd, .xmind, .icns, .svg
• ›Font: .ttf, .otf, .woff, .woff2
• ›Markdown: .md, .markdown
• ›HTML: .html, .htm
• ›HTTP request: .http, .rest
• ›Windows Registry: .reg
• ›Java: .class (decompiler)
• ›Compressed files: .zip, .jar, .vsix, .rar, .7z, .tar, .tar.gz, .tgz, .apk

##Markdown

This extension replaces the default Markdown editor with a WYSIWYG editor.

To use the built-in VS Code Markdown editor instead, add this to your settings.json:

{
    "workbench.editorAssociations": {
        "*.md": "default",
        "*.markdown": "default"
    }
}

Right-click in the editor to export Markdown to PDF, DOCX, or HTML. PDF export requires Chromium; set the browser path with vscode-office.chromiumPath.

Shortcuts: Based on shortcut.md, plus:

• ›Move list up: Ctrl Alt I / ⌘ ^ I
• ›Move list down: Ctrl Alt J / ⌘ ^ J
• ›Edit in VS Code: Ctrl Alt E / ⌘ ^ E

Long code blocks are capped (default 400px) with an expand/collapse button to view them in full. Change the default height via the editor toolbar's ⚙ Settings → Code block height (down to compact, up to unlimited).

##Other features

• ›HTML: live preview while editing; press Ctrl+Shift+V to open the live view
• ›Git History: browse commit graph, view file history, compare revisions, and perform common Git operations from the Source Control view or file context menu
• ›YAML: document outline and anchor navigation (Go to Definition for alias references)
• ›Icon theme: includes a subset of Material Icon Theme icons, plus Office Material Icon Theme and One Dark Modern color themes
• ›Excel: preview and save .xlsx, .xls, .xlsm, .csv, and .ods files (saving .xlsx may lose formatting; .csv does not support GBK-encoded Chinese)
• ›HTTP: send requests from .http and .rest files (integrated from REST Client with fixes for local request issues); press Ctrl+Enter / ⌘ Enter to send
• ›Java: decompile and view .class files

##Sponsor

Database Client for Visual Studio Code, supporting the management of MySQL/MariaDB, PostgreSQL, SQLite, Redis, and ElasticSearch, and works as an SSH client to boost your productivity! Get it now.

##Development Guide

###Prerequisites

• ›Node.js 18+
• ›VS Code 1.64+

###Getting started

git clone https://github.com/cweijan/vscode-office.git
cd vscode-office
npm install

###Development

Desktop extension (full feature set):

npm run dev

Press F5 in VS Code, or choose Extension from Run and Debug.

Web extension (Markdown, HTML, YAML in the browser):

npm run dev:web

Choose Extension (Web) from Run and Debug.

###Build & package

npm run build    # production build
npm run package  # create .vsix

##Usage data

Office Viewer collects anonymous usage data to understand which preview features are used, so we can improve the extension. Data is sent to Azure Application Insights via the official @vscode/extension-telemetry module.

###What we collect

We do not collect file paths, file names, URLs, repository names, request contents, or other personally identifiable information.

###How to opt out

Telemetry is sent only when both of the following allow it:

1. ›VS Code global telemetry is enabled (telemetry.telemetryLevel is not off, or telemetry.enableTelemetry is true on older versions).
2. ›Extension telemetry is enabled: set vscode-office.enableTelemetry to false in Settings.

You can also disable all VS Code telemetry in Settings → Application → Telemetry.

###Maintainer setup

If you build and publish this extension yourself, see docs/telemetry.md for Azure Application Insights setup and sample queries.

##Credits

• ›PDF rendering: mozilla/pdf.js
• ›DOCX rendering: VolodymyrBaydalka/docxjs
• ›PPTX rendering: pptxviewjs
• ›XLSX rendering:
  • ›SheetJS/sheetjs: XLSX parsing
  • ›myliang/x-spreadsheet: XLSX rendering
• ›EPUB: futurepress/epub.js
• ›PSD: ag-psd
• ›XMind: mind-elixir, @mind-elixir/import-xmind
• ›HEIC conversion: heic2any
• ›Java decompiler: JetBrains/java-decompiler
• ›HTTP: REST Client
• ›Markdown: Vanessa219/vditor
• ›Material Icon theme: PKief/vscode-material-icon-theme