Secr for VS Code

Manage secrets from your editor. Browse, set, edit, delete secrets, switch environments, pull to .env, and run commands with secrets injected — all without leaving VS Code.

Prerequisites

Secr CLI installed and logged in (secr login)
A project initialized with secr init (creates .secr.json in your workspace root)

Installation

The extension is not yet published to the VS Code Marketplace. To install locally:

cd extensions/vscode
npm install
npm run build

Then press F5 in VS Code to launch the Extension Development Host, or package it manually:

npx vsce package
code --install-extension secr-vscode-0.1.0.vsix

Getting Started

Log in — Run Secr: Login from the command palette (Cmd+Shift+P). You can either paste a token directly or choose "Use CLI Login" which opens a terminal running secr login. The extension watches ~/.secr/credentials.json and picks up CLI logins automatically.
Open a project — Open a workspace that contains a .secr.json file. The extension activates automatically when it detects one.
Browse secrets — The Secr sidebar (lock icon in the activity bar) shows your project's environments and secrets in a tree view.
Switch environments — Click the status bar item at the bottom ($(key) project/env) or run Secr: Switch Environment.

Commands

All commands are available via the command palette (Cmd+Shift+P).

Command	Description
Secr: Login	Authenticate with a token or via CLI
Secr: Logout	Clear stored credentials
Secr: Refresh	Reload secrets and project data
Secr: Switch Environment	Pick a different environment
Secr: Set Secret	Create or update a secret
Secr: Edit Secret	Edit an existing secret's value
Secr: Delete Secret	Delete a secret (with confirmation)
Secr: Copy Secret Value	Copy a secret's decrypted value to clipboard
Secr: View Secret History	Browse version history for a secret
Secr: Pull Secrets to .env	Write all secrets to a `.env` file in your workspace
Secr: Import .env File	Parse a `.env` file and bulk-set secrets to secr
Secr: Run Command with Secrets	Open a terminal with secrets injected as environment variables

Tree View

The sidebar tree shows:

Secr
├── development (active)
│   ├── DATABASE_URL      v3 - Main database connection
│   ├── API_KEY           v1
│   └── JWT_SECRET        v2
├── staging
│   └── ...
└── production
    └── ...

Click a secret to copy its value
Right-click for edit, delete, and view history options
Use the + button in the tree title bar to add a new secret
Use the refresh button to reload data

Configuration

Settings

Setting	Default	Description
`secr.apiUrl`	(empty)	Override the API URL. Leave empty to use `https://api.secr.dev` or the value from your credentials file.

Authentication Priority

The extension resolves auth tokens in this order:

~/.secr/credentials.json (shared with CLI)
VS Code SecretStorage (set via Secr: Login > "Enter Token")

API URL Priority

apiUrl from ~/.secr/credentials.json
secr.apiUrl VS Code setting
https://api.secr.dev (default)

Project Config

The extension reads .secr.json from your workspace root:

{
  "org": "my-org",
  "project": "my-project",
  "defaultEnvironment": "development"
}

This file is created by secr init. The extension watches it for changes and reloads automatically.

Development

cd extensions/vscode
npm install
npm run build    # one-time build
npm run watch    # rebuild on changes
npm run lint     # type-check with tsc

Press F5 to launch the Extension Development Host for testing.

Project Structure

extensions/vscode/
├── package.json            # Extension manifest
├── tsconfig.json
├── .vscodeignore
├── media/
│   └── icon.svg            # Activity bar icon
├── dist/
│   └── extension.js        # Bundled output (esbuild)
└── src/
    ├── extension.ts        # Entry point — activate/deactivate
    ├── auth.ts             # Credentials file, file watcher, token input
    ├── config.ts           # .secr.json detection and parsing
    ├── client.ts           # SecrClient wrapper with auth
    ├── api-helpers.ts      # Raw fetch for endpoints not in SDK
    ├── state.ts            # Current environment tracking
    ├── statusbar.ts        # Status bar item
    ├── views/
    │   └── secrets-tree.ts # TreeDataProvider for secrets sidebar
    └── commands/
        ├── secrets.ts      # Copy, set, edit, delete, history
        ├── env.ts          # Switch env, pull .env, import .env
        └── terminal.ts     # Run command with secrets