Roblox Sync — VS Code Extension

Connect Visual Studio Code to a Roblox workspace using an invite code + Roblox OAuth.

How it works

1. On launch (or via Command Palette), a prompt appears: "Please enter ur invite code for the workspace"
2. Enter any invite code → browser opens Roblox OAuth consent screen
3. User authorizes → Roblox redirects back to VS Code automatically
4. VS Code receives the token, stores it, and confirms the connection

Setup (Required before it works)

1. Create a Roblox OAuth App

1. Go to create.roblox.com/dashboard/credentials
2. Click Create OAuth 2.0 App
3. Set Redirect URI to:

   vscode://roblox-sync.roblox-sync/auth-callback
   

4. Enable scopes: openid, profile
5. Copy your Client ID

2. Set your Client ID

Option A — in src/extension.ts, replace:

const CLIENT_ID = "YOUR_ROBLOX_CLIENT_ID";

Option B — via VS Code Settings:

robloxSync.clientId = "your_actual_client_id"

Install & Run

# Install dependencies
npm install

# Compile TypeScript
npm run compile

# Press F5 in VS Code to launch Extension Development Host

Or package it as a .vsix:

npm install -g @vscode/vsce
vsce package
code --install-extension roblox-sync-0.1.0.vsix

Commands

OAuth Flow Detail

This extension uses PKCE (Proof Key for Code Exchange) — no client secret is ever stored or transmitted. The flow:

User enters invite code
        ↓
Browser → Roblox OAuth authorize endpoint
        ↓
User logs in & clicks Allow
        ↓
Roblox redirects to vscode://roblox-sync.roblox-sync/auth-callback?code=...
        ↓
VS Code URI handler catches the callback
        ↓
Extension POSTs to Roblox token endpoint (PKCE, no secret)
        ↓
Access token stored in VS Code globalState (encrypted by OS keychain)
        ↓
Status bar shows ✅ Connected

Notes

• The invite code can be any string — it's stored and associated with the workspace session after OAuth completes.
• Tokens are stored in VS Code's globalState (persisted across sessions).
• No server-side component is needed — pure client PKCE flow.