VikiEditor Live Sync

Real-time file sync from your local project to VikiEditor.

When Claude Code (or you) edits files locally, changes are automatically pushed to a VikiEditor document in real-time.

Quick Start

# 1. Get your API key from VikiEditor > Settings > API Keys

# 2. Set the environment variable
export VIKIEDITOR_API_KEY=vk_your_key_here

# 3. Run in your project directory
cd /path/to/your/project
npx vikieditor-live-sync

# Or install globally
npm install -g vikieditor-live-sync
viki-sync

How It Works

1. Watches your project files for changes
2. Captures diffs when files are modified
3. Pushes changes to VikiEditor every 3 seconds
4. Creates a session document automatically (or uses existing one)

Configuration

Environment Variables

| Variable | Required | Description | |----------|----------|-------------| | VIKIEDITOR_API_KEY | Yes | Your API key from VikiEditor Settings | | VIKIEDITOR_DOCUMENT_ID | No | Target document (auto-created if not set) | | VIKIEDITOR_API_URL | No | API URL (default: https://vikieditor.piai.company) |

Config File (.viki-sync.json)

Create a .viki-sync.json in your project root:

{
  "apiKey": "vk_xxx...",
  "documentId": "optional-existing-doc-id",
  "watchPaths": ["src", "lib"],
  "projectName": "My Awesome Project"
}

Generate a template config:

viki-sync --init

What Gets Synced

By default, watches these file types:

• TypeScript/JavaScript: .ts, .tsx, .js, .jsx
• Python: .py
• Go: .go
• Rust: .rs
• Markdown: .md
• Config: .json, .yaml, .yml
• Styles: .css, .scss
• Templates: .html, .vue, .svelte

Ignores:

• node_modules/
• .git/
• dist/, build/, .next/
• Lock files

Output Example

In your VikiEditor document:

# Live Session: my-project

**Started**: 1/24/2026, 3:45:00 PM
**Project**: `/Users/you/projects/my-project`

---

## File Changes

### `src/components/Button.tsx` - 3:45:12 PM
> +5 -2

\`\`\`diff
+ import { memo } from 'react';
+
- export function Button({ label }) {
+ export const Button = memo(function Button({ label, onClick }) {
+   return <button onClick={onClick}>{label}</button>;
  }
\`\`\`

Use Cases

• Claude Code Sessions: See what Claude is changing in real-time
• Pair Programming: Share live coding sessions via VikiEditor
• Work Logging: Automatic documentation of code changes
• Debugging: Review recent changes when something breaks

Troubleshooting

"Missing VIKIEDITOR_API_KEY"

Get your API key from VikiEditor > Settings > API Keys

"Failed to connect"

Check that your API key is valid and has write permissions

Changes not syncing

• Ensure the file extension is in the watched list
• Check the file isn't in an ignored directory
• Changes are buffered and synced every 3 seconds

License

MIT