Development Environment

Relevant source files

The following files were used as context for generating this wiki page:

• package.json
• vite.config.ts
• README.md
• src/electron/main.ts
• src/electron/util.ts
• electron-builder.json

The development environment for Agent Cowork is a hybrid architecture designed to support a native desktop experience using Electron, a modern frontend powered by React and Vite, and a backend integration with the Claude Agent SDK. It leverages a dual-process model where a Vite development server handles frontend hot-reloading while a transpiled Electron process manages system-level interactions and AI orchestration.

This environment requires specific tooling—primarily Bun or Node.js 22+—and relies on a pre-installed and authenticated Claude Code CLI to function as the underlying agentic engine. Sources: README.md:55-58, package.json:11-15

Core Tech Stack

The project utilizes a specific set of technologies to maintain a cross-platform desktop application.

Category	Technology	Description
Runtime	Bun / Node.js 22+	The primary JavaScript execution environment.
Framework	Electron 39	Orchestrates the main and renderer processes.
Frontend	React 19 / Vite	Powers the user interface with hot-module replacement.
Styling	Tailwind CSS 4	Utility-first CSS framework integrated via Vite plugin.
AI SDK	@anthropic-ai/claude-agent-sdk	Provides the interface for AI task execution.
Build Tool	electron-builder	Package manager for generating production binaries.

Sources: package.json:34-63, README_ZH.md:143-150

Development Workflow and Scripts

The development lifecycle is managed through a series of scripts defined in package.json. The primary entry point for developers is bun run dev, which orchestrates the simultaneous execution of the React frontend and the Electron main process.

Script Execution Flow

The following diagram illustrates how the development environment initializes when the dev command is triggered.

The development server ensures that any changes to the UI are reflected immediately via Vite's dev server, while changes to the Electron main process require a restart. Sources: package.json:11-14, src/electron/main.ts:63-65

Key Development Scripts

• dev: Cleans up existing processes and starts both React and Electron in development mode.
• build: Runs TypeScript compilation for the main process and Vite build for the frontend.
• rebuild: Force rebuilds native dependencies like better-sqlite3 for the current Electron version.
• transpile:electron: Specifically compiles the TypeScript files located in the src/electron directory.

Sources: package.json:10-18

Configuration and Tooling

Vite Configuration

The Vite environment is configured to support React and Tailwind CSS while handling environment variables such as the communication port. It is set up to output build artifacts to dist-react.

// vite.config.ts
export default defineConfig(({ mode }) => {
	const env = loadEnv(mode, process.cwd(), '');
	const port = parseInt(env.PORT); 

	return {
		plugins: [react(), tailwindcss(), tsconfigPaths()],
		base: './',
		build: {
			outDir: 'dist-react',
		},
		server: {
			port,
			strictPort: true,
		},
	};
});

Sources: vite.config.ts:6-22

Main Process Utilities

The environment includes a safety mechanism to prevent malicious events by validating the origin of IPC (Inter-Process Communication) messages. In development mode, it explicitly allows traffic from localhost on the designated DEV_PORT.

Build and Distribution

Production binaries are generated using electron-builder. The configuration supports multi-platform builds for macOS (dmg), Windows (portable), and Linux (AppImage).

Build Targets

• macOS: Supports both arm64 (Apple Silicon) and x64 (Intel).
• Windows: Generates a portable executable.
• Linux: Packages as an AppImage under the "Utility" category.

Sources: electron-builder.json:13-25, package.json:19-22

Resource Management

During the build process, the environment ensures that the @anthropic-ai/claude-agent-sdk is unpacked from the ASAR archive (asarUnpack). This is critical because the SDK requires direct filesystem access to its CLI components to function correctly within the packaged application. Sources: electron-builder.json:10-12

Conclusion

The Agent Cowork development environment is structured to bridge the gap between high-speed web development (Vite/React) and native system capabilities (Electron). By leveraging Bun for performance and strict TypeScript configurations for the main process, the environment provides a robust platform for extending AI collaboration features while maintaining compatibility with the existing Claude Code CLI infrastructure.