Skip to content

Commit d2a0712

Browse files
antfubotantfubot
committed
feat(plugins): add @devframes/plugin-code-server
Embed code-server (VS Code in the browser) as a devframe panel: detect a local install (with install guidance when missing), launch it on demand, and render the editor in an auto-authenticated iframe. code-server runs with password auth; the plugin hands the matching session cookie to the already-authorized devframe client so the editor loads signed in. Ships standalone (CLI), Vite, and embedded host integrations.
1 parent 09f382a commit d2a0712

48 files changed

Lines changed: 2108 additions & 15 deletions

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

‎alias.ts‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import { join, relative } from 'pathe'
44

55
const root = fileURLToPath(new URL('.', import.meta.url))
66
const r = (path: string) => fileURLToPath(new URL(`./packages/${path}`, import.meta.url))
7+
const p = (path: string) => fileURLToPath(new URL(`./plugins/${path}`, import.meta.url))
78

89
export const alias = {
910
'devframe/rpc/transports/ws-server': r('devframe/src/rpc/transports/ws-server.ts'),
@@ -44,6 +45,14 @@ export const alias = {
4445
'@devframes/hub': r('hub/src/index.ts'),
4546
'@devframes/nuxt/runtime/plugin.client': r('nuxt/src/runtime/plugin.client.ts'),
4647
'@devframes/nuxt': r('nuxt/src/index.ts'),
48+
'@devframes/plugin-code-server/client': p('code-server/src/client/index.ts'),
49+
'@devframes/plugin-code-server/node': p('code-server/src/node/index.ts'),
50+
'@devframes/plugin-code-server/constants': p('code-server/src/constants.ts'),
51+
'@devframes/plugin-code-server/types': p('code-server/src/types.ts'),
52+
'@devframes/plugin-code-server/rpc': p('code-server/src/rpc/index.ts'),
53+
'@devframes/plugin-code-server/cli': p('code-server/src/cli.ts'),
54+
'@devframes/plugin-code-server/vite': p('code-server/src/vite.ts'),
55+
'@devframes/plugin-code-server': p('code-server/src/index.ts'),
4756
'devframe/recipes/open-helpers': r('devframe/src/recipes/open-helpers.ts'),
4857
'devframe/client': r('devframe/src/client/index.ts'),
4958
'devframe': r('devframe/src'),

‎plugins/code-server/.gitignore‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
dist
2+
.turbo
3+
*.tsbuildinfo

‎plugins/code-server/README.md‎

Lines changed: 66 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,66 @@
1+
# @devframes/plugin-code-server
2+
3+
Run [code-server](https://github.com/coder/code-server) (VS Code in the
4+
browser) as a devframe panel. The plugin detects a local `code-server`
5+
install, launches it on demand, and embeds the editor in an
6+
auto-authenticated `<iframe>`.
7+
8+
## How it works
9+
10+
- **Detection** — on startup it runs `code-server --version`. When the binary
11+
is missing, the launcher renders install instructions and links instead of a
12+
launch button.
13+
- **Launch** — the launcher's button starts code-server as a managed child
14+
process bound to a free port, scoped to the workspace. Readiness is probed
15+
via code-server's `/healthz` endpoint.
16+
- **Auto-auth** — code-server runs with password auth. The plugin generates a
17+
random token, sets `HASHED_PASSWORD` to its SHA-256, and hands the matching
18+
session cookie back to the already-authorized devframe client. The launcher
19+
applies that cookie for the current host before loading the iframe, so the
20+
editor opens already signed in — no code-server login page.
21+
22+
The editor iframe points at code-server's own origin
23+
(`<protocol>//<host>:<port>/`), so WebSocket traffic flows directly without a
24+
reverse proxy.
25+
26+
## Usage
27+
28+
### Standalone CLI
29+
30+
```sh
31+
npx @devframes/plugin-code-server # dev server + launcher
32+
```
33+
34+
### Programmatic
35+
36+
```ts
37+
import { createCodeServerDevframe } from '@devframes/plugin-code-server'
38+
39+
export default createCodeServerDevframe({
40+
// bin: 'code-server', // binary to detect/launch (default: PATH)
41+
// serverPort: 8080, // force a port (default: free port near 8080)
42+
// args: ['--disable-getting-started-override'],
43+
})
44+
```
45+
46+
### Vite host
47+
48+
```ts
49+
import { codeServerVite } from '@devframes/plugin-code-server/vite'
50+
51+
export default {
52+
plugins: [codeServerVite()],
53+
}
54+
```
55+
56+
## RPC
57+
58+
| Function | Type | Purpose |
59+
|----------|------|---------|
60+
| `devframes-plugin-code-server:detect` | query | Re-probe for the binary; returns `{ installed, version, bin }`. |
61+
| `devframes-plugin-code-server:status` | query | Current status + auth cookie when running. |
62+
| `devframes-plugin-code-server:start` | action | Launch and wait for readiness. |
63+
| `devframes-plugin-code-server:stop` | action | Stop the process. |
64+
65+
Status (minus the auth cookie) is mirrored into the
66+
`devframes-plugin-code-server:state` shared state for reactive UIs.

‎plugins/code-server/bin.mjs‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
#!/usr/bin/env node
2+
import process from 'node:process'
3+
import { createCodeServerCli } from './dist/cli.mjs'
4+
5+
async function main() {
6+
const cli = createCodeServerCli()
7+
await cli.parse()
8+
}
9+
10+
main().catch((error) => {
11+
console.error(error)
12+
process.exit(1)
13+
})

‎plugins/code-server/package.json‎

Lines changed: 71 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,71 @@
1+
{
2+
"name": "@devframes/plugin-code-server",
3+
"type": "module",
4+
"version": "0.5.2",
5+
"description": "Run code-server (VS Code in the browser) as a devframe panel — detect a local install, launch it on demand, and embed the editor in an auto-authenticated iframe.",
6+
"author": "Anthony Fu <anthonyfu117@hotmail.com>",
7+
"license": "MIT",
8+
"homepage": "https://github.com/devframes/devframe#readme",
9+
"repository": {
10+
"directory": "plugins/code-server",
11+
"type": "git",
12+
"url": "git+https://github.com/devframes/devframe.git"
13+
},
14+
"bugs": "https://github.com/devframes/devframe/issues",
15+
"keywords": [
16+
"devframe",
17+
"devframe-plugin",
18+
"devtools",
19+
"code-server",
20+
"vscode"
21+
],
22+
"sideEffects": false,
23+
"exports": {
24+
".": "./dist/index.mjs",
25+
"./client": "./dist/client/index.mjs",
26+
"./cli": "./dist/cli.mjs",
27+
"./constants": "./dist/constants.mjs",
28+
"./node": "./dist/node/index.mjs",
29+
"./rpc": "./dist/rpc/index.mjs",
30+
"./types": "./dist/types.mjs",
31+
"./vite": "./dist/vite.mjs",
32+
"./package.json": "./package.json"
33+
},
34+
"types": "./dist/index.d.mts",
35+
"bin": {
36+
"devframe-code-server": "./bin.mjs"
37+
},
38+
"files": [
39+
"bin.mjs",
40+
"dist"
41+
],
42+
"scripts": {
43+
"build": "tsdown && vite build --config src/spa/vite.config.ts",
44+
"watch": "tsdown --watch",
45+
"dev": "vite --config src/spa/vite.config.ts --host 0.0.0.0",
46+
"test": "vitest run",
47+
"prepack": "pnpm run build"
48+
},
49+
"peerDependencies": {
50+
"devframe": "workspace:*",
51+
"vite": "^8.0.0"
52+
},
53+
"peerDependenciesMeta": {
54+
"vite": {
55+
"optional": true
56+
}
57+
},
58+
"dependencies": {
59+
"get-port-please": "catalog:deps",
60+
"nostics": "catalog:deps"
61+
},
62+
"devDependencies": {
63+
"@types/node": "catalog:types",
64+
"devframe": "workspace:*",
65+
"h3": "catalog:deps",
66+
"tsdown": "catalog:build",
67+
"vite": "catalog:build",
68+
"vitest": "catalog:testing",
69+
"ws": "catalog:deps"
70+
}
71+
}

‎plugins/code-server/src/cli.ts‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
import type { CliHandle, CreateCliOptions } from 'devframe/adapters/cli'
2+
import type { CodeServerOptions } from './types'
3+
import { createCli } from 'devframe/adapters/cli'
4+
import { createCodeServerDevframe } from './index'
5+
6+
/**
7+
* Build a standalone CLI for the code-server panel — `dev` / `build` / `mcp`
8+
* subcommands, backed by {@link createCodeServerDevframe}. Used by the package
9+
* `bin` (`devframe-code-server`).
10+
*/
11+
export function createCodeServerCli(
12+
options: CodeServerOptions = {},
13+
cliOptions: CreateCliOptions = {},
14+
): CliHandle {
15+
return createCli(createCodeServerDevframe(options), cliOptions)
16+
}

0 commit comments

Comments
 (0)