Files
typst-leaf/typst-leaf-frontend/vite.config.ts
T
nav.sikand 061f95ddee feat: barebones MVP — editor, live LSP, and preview
Backend (typst-leaf-backend)
- REST API for multi-project file management under PROJECTS_ROOT
  (list/create projects, get file tree, read/write files; zod-validated
  sandbox prevents path traversal).
- LSP thin proxy: spawns a single tinymist lsp process, pipes one active
  WebSocket straight to its stdio via vscode-ws-jsonrpc. New connections
  trigger a takeover (old session disposed, fresh tinymist spawned).
- Live preview pipeline: the frontend sends tinymist.startDefaultPreview
  over the LSP wire, reads the returned data-plane port, and relays it to
  the backend. The backend proxies /preview (WS, with retry and an Origin
  header for typst-preview) and /preview-app (HTTP, injecting a script that
  rewrites the webview's WS path to /preview and forces light mode).
- Graceful SIGTERM/SIGINT shutdown.
- Auto-seeds a hello project on first boot.
- Removed execa dependency (no longer needed).

Frontend (typst-leaf-frontend)
- Monaco editor with typst syntax highlighting (Monarch tokenizer) and
  live LSP diagnostics (markers), completion, hover, definitions, and
  formatting — all driven by a raw JSON-RPC WebSocket client (no
  monaco-languageclient or vscode-api dependency).
- Project picker and file tree sidebar.
- Live preview pane: iframes the typst-preview webview through the
  backend's /preview-app proxy, so the pipedepeline works remotely.
- Monaco bundled locally (no CDN) with a Vite worker setup.
- Vite dev proxy so relative /api, /lsp, /preview, and /preVIEW-app URLs
  reach the backend on port 4000.
- Light-mode UI (editor 'vs' theme, white chrome).
- Prevent esbuild from tree-shaking monaco.editor services
  (optimizeDeps.esbuildOptions.treeShaking: false).

Infrastructure
- Added vscode-ws-jsonrpc to backend dependencies.
- Removed monaco-languageclient and vscode-ws-jsonrpc from frontend
  dependencies (replaced by the raw JSON-RPC client).
- Added monaco-editor as a direct frontend dependency.
- Updated README (correct frontend port 1420, tinymist install command,
  environment variables, architecture).
- Added projects/ to .gitignore.
- Renamed Tauri productName and page title to typst-leaf.
2026-07-01 20:53:42 +05:30

57 lines
1.8 KiB
TypeScript

import tailwindcss from "@tailwindcss/vite";
import react from "@vitejs/plugin-react";
import { defineConfig } from "vite";
// @ts-expect-error process is a nodejs global
const host = process.env.TAURI_DEV_HOST;
// https://vite.dev/config/
export default defineConfig(async () => ({
plugins: [tailwindcss(), react()],
// Force esbuild to tree-shake as little as possible from monaco-editor.
// By default, Vite's pre-bundling applies tree-shaking which discards
// `monaco.languages.createDiagnosticCollection` and other standalone-editor
// services that we need at runtime.
optimizeDeps: {
esbuildOptions: {
treeShaking: false,
},
},
// Vite options tailored for Tauri development and only applied in `tauri dev` or `tauri build`
//
// 1. prevent Vite from obscuring rust errors
clearScreen: false,
// 2. tauri expects a fixed port, fail if that port is not available
server: {
port: 1420,
strictPort: true,
host: host || false,
hmr: host
? {
protocol: "ws",
host,
port: 1421,
}
: undefined,
watch: {
// 3. tell Vite to ignore watching `src-tauri`
ignored: ["**/src-tauri/**"],
},
// Dev proxy: the SPA talks to the backend via relative URLs so that the
// same code works in dev (Vite :1420 → backend :4000) and in self-hosted
// prod (behind a reverse proxy). The preview webview and its WS are also
// proxied so the iframe is same-origin with the app.
proxy: {
"/api": "http://localhost:4000",
"/preview-app": {
target: "http://localhost:4000",
// the webview is HTML; rewrite so the path is preserved for upstream
ws: false,
},
"/lsp": { target: "ws://localhost:4000", ws: true },
"/preview": { target: "ws://localhost:4000", ws: true },
},
},
}));