DocuThinker Viewer – VS Code Extension
Embed DocuThinker (AI‑powered document upload, summarization & insight extraction) directly into your VS Code.
Features
- Activity Bar entry: click the DocuThinker icon in the Activity Bar to open the embedded app.
- Instant Document Panel via the Command Palette (
DocuThinker: Open).
- Persistent Webview that preserves your upload session when hidden or you switch files.
- Configurable panel title, editor column, iframe width/height, script permissions, and auto‑open.
- Secure iframe with strict Content‑Security‑Policy loading
https://docuthinker.vercel.app/home.
- No extra backend—all processing happens in your existing DocuThinker web app.
VS Code Marketplace
To avoid manual installation, you can find the extension on the VSCode Marketplace.
Feel free to leave a review or report issues there!
Launch from VS Code
We also provide a quick way to launch the DocuThinker Viewer extension directly from VS Code:
- Go to the Run and Debug view (
Ctrl+Shift+D / ⌘+Shift+D).
- Select Run Extension from the dropdown.
- Click the green play button to start the extension in a new Extension Development Host window.
- Click the DocuThinker icon in the Activity Bar, or open the Command Palette (
Ctrl+Shift+P / ⌘+Shift+P) and run DocuThinker: Open.
- Upload your PDF or Word document to view summaries and insights.
This is achieved via the .vscode/launch.json configuration, which allows you to run the extension in a development environment without needing to package it first.
VSIX Installation
- Clone & enter the extension folder
git clone https://github.com/hoangsonww/DocuThinker-AI-App.git
cd DocuThinker-AI-App/extension
- Install dependencies & compile
npm install
npm run compile
- Package as a VSIX
vsce package
→ produces docuthinker-chat-0.0.1.vsix
Install the VSIX
code --install-extension docuthinker-chat-0.0.1.vsix
- VS Code UI:
Extensions view → “ ” → **Install from VSIX ** → select the file
Usage
- Click the DocuThinker icon in the Activity Bar.
- Use the embedded view directly, or run DocuThinker: Open from the Command Palette to open a larger editor panel.
- Upload a supported file, then view summaries and extracted insights in VS Code.
Configuration
Open Settings → Extensions → DocuThinker Viewer:
| Setting |
Default |
Description |
docuthinkerViewer.panelTitle |
DocuThinker Viewer |
Title of the Webview panel. |
docuthinkerViewer.viewColumn |
1 |
Editor column (0=active, 1–3) to open the panel in. |
docuthinkerViewer.retainContext |
true |
Keep the upload/session state when hidden. |
docuthinkerViewer.enableScripts |
true |
Allow scripts to run inside the iframe. |
docuthinkerViewer.iframeWidth |
100% |
CSS width of the embedded iframe. |
docuthinkerViewer.iframeHeight |
100% |
CSS height of the embedded iframe. |
docuthinkerViewer.openOnStartup |
false |
Auto‑open panel on VS Code startup. |
Development
Troubleshooting
- Blank panel: Check that
https://docuthinker.vercel.app/home is reachable.
- CSP errors: Ensure the iframe
src URI exactly matches the frame-src CSP directive.
License
MIT (see LICENSE for details).
About DocuThinker
DocuThinker is a full‑stack FERN‑Stack AI app for document upload, summarization, and insight extraction.
Learn more in the main repo:
👉 hoangsonww/DocuThinker-AI-App
or try it live: https://docuthinker.vercel.app/home
