A powerful, light-weight Visual Studio Code extension that allows you to easily edit stringified JSON strings and JavaScript object literals inline using a side-by-side formatted editor.
No more manual unescaping, quote fixing, or formatting!
Features
Inline JS/JSON Editing: Select any stringified JS/JSON value and edit it directly.
Smart unwrapping: Handles double-quoted or single-quoted JSON strings that are wrapped in string literals.
Support for JS Literals: Safely parses and preserves special JavaScript types (e.g., Date, RegExp, undefined, Infinity, NaN, and functions) using a sandboxed context, which traditional JSON.parse would fail on or strip.
Formatted Side-by-Side Editor: Automatically formats and opens the object in a temporary .js document on the side, giving you the power of VS Code's rich syntax highlighting, auto-formatting, and linting.
Auto Write-back on Save: Every time you save the temporary document, the contents are validated and automatically serialized, escaped, and written back to your selection in the source document.
Safe Sandbox Execution: Parsing runs in a sandboxed Node VM context, keeping your environment secure.
How to Use
Select the JS object literal or stringified JSON in your document.
Right-click and choose Edit as JS/JSON from the context menu.
OR press Ctrl+Shift+J (Windows/Linux) or Cmd+Shift+J (macOS).
Edit: A temporary formatted JS editor will open beside your current active file. Modify it freely.
Save to Sync: Press Ctrl+S (or Cmd+S) to save the temporary editor. The changes are validated and synced back to your original selection automatically.
Close: Close the temporary editor when you're finished. The extension will automatically clean up the temporary file.
Extension Settings & Keybindings
This extension contributes the following configuration/keybindings:
ctrl+shift+j (Windows/Linux) / cmd+shift+j (macOS): Opens the inline JS/JSON editor for the selected text.
