mirror of
https://github.com/software-mansion/argent.git
synced 2026-09-14 19:27:14 +08:00
36aa14a5fc
Adds the Argent documentation site, published to [docs.swmansion.com/argent](https://docs.swmansion.com/argent): a branded Docusaurus project under `packages/docs/`, the full first set of pages, and the CI that checks and deploys it. <img width="1512" height="945" alt="Screenshot 2026-08-21 at 13 05 04" src="https://github.com/user-attachments/assets/4607e143-4359-49a8-93a2-aaa3af4c9534" /> ## Site A standalone Docusaurus 3.9 project, built on the shared Software Mansion docs theme ([`@swmansion/t-rex-ui`](https://www.npmjs.com/package/@swmansion/t-rex-ui)) and restyled for Argent: - **Palette** from [argent.swmansion.com](https://argent.swmansion.com): dark `#0D0F26`, blue `#99DAFF`, lavender `#E4E1FF`, light `#FEFEFE`, mist `#F1F1F1`. The `--swm-*` token names stay, since the shared theme resolves against them. - **Typography**: DM Sans and DM Mono, matching the landing page. - **Sidebar** with lucide icons on every page entry (`sidebar_custom_props.icon` in the front matter, registered in `src/theme/SidebarIcon`), the logo kept on the page background and the panel inset from the edge. - **Video component** for embedded screen recordings, with `scripts/encode-video.sh` producing a web-sized MP4 and a poster frame for each clip in `static/video/`. - **Copy page button** and a few theme fixes: inline code badges in tables, paginator hover. - **No landing page.** That stays at argent.swmansion.com. The root route redirects to Getting started. ## Content Three sections in `docs/`: - **Fundamentals**: getting started, installation, supported platforms. - **Features**: interacting with apps, flows, network, screen recording, lens, visual regression, profiling, debugging. Conceptual overviews with recordings, each linking to the tools reference. - **Reference**: tools, CLI, configuration, flow YAML, editors, telemetry. Prose follows Simplified Technical English. The conventions (style, front matter, icons, checks) are written down in `packages/docs/CLAUDE.md`, and a root `CLAUDE.md` adds a checklist so that code changes to tools, CLI, configuration or flows update the matching docs page in the same pull request. ## CI and deploy - `Docs build` runs `format:check`, `lint`, `typecheck` and `build` on every pull request that touches `packages/docs/`. The build has `onBrokenLinks: "throw"`, so it catches links left dangling by a moved page. - `Docs publish` deploys `packages/docs/build` through the GitHub Actions Pages source on every push to `main` that touches the docs. The repository Pages source needs to be set to **GitHub Actions** for the first run. ## Notes for review - The site is excluded from the root `packages/*` workspaces (`!packages/docs`) and keeps its own `package.json` and `package-lock.json`, so its dependency tree stays out of the toolkit's lockfile. Root Prettier, ESLint and knip ignore it; it formats and lints itself with the repo `.prettierrc` and its own `eslint.config.mjs`. `check-workspace-versions.mjs` skips it so its `0.0.0` version is not read as drift. - `webpack` is pinned to `5.105.4` and `@docusaurus/plugin-content-docs` / `theme-common` to `3.9.2` via `overrides`. Newer webpack fails Docusaurus 3.9's ProgressPlugin option validation, and a hoisted `plugin-content-docs@3.10.2` produced a duplicate React context that crashed SSR. - **Search is not wired up yet.** The shared theme always mounts a DocSearch bar, so an `algolia` block has to be present. It reads `ALGOLIA_APP_ID` / `ALGOLIA_API_KEY` / `ALGOLIA_INDEX_NAME` from the environment and the bar stays hidden until Argent has its own DocSearch application. Follow-up PR. ## Testing - `npm run format:check`, `npm run lint`, `npm run typecheck` and `npm run build` pass in `packages/docs/`. - Root `prettier --check`, `eslint` and `npm run knip` pass. - Walked the served production build in the browser in light and dark themes while iterating: root redirect, docs pages, sidebar icons, videos, TOC, footer. --------- Co-authored-by: Claude Opus 5 (1M context) <noreply@anthropic.com>
189 lines
8.2 KiB
Markdown
189 lines
8.2 KiB
Markdown
# Contributing to Argent
|
|
|
|
Thank you for your interest in contributing to Argent! This guide covers everything you need to get started.
|
|
|
|
## Table of contents
|
|
|
|
- [Requirements](#requirements)
|
|
- [Setting up the dev environment](#setting-up-the-dev-environment)
|
|
- [Project structure](#project-structure)
|
|
- [Building](#building)
|
|
- [Running the project](#running-the-project)
|
|
- [Running tests](#running-tests)
|
|
- [Code style](#code-style)
|
|
- [Submitting a pull request](#submitting-a-pull-request)
|
|
|
|
---
|
|
|
|
## Requirements
|
|
|
|
- **macOS** with Xcode installed (required for `xcrun simctl` and iOS simulator support)
|
|
- **Node.js 20.19+** (the lint toolchain's floor; the published package needs 20.12+)
|
|
- The `simulator-server` and `ax-service` binaries in `packages/native-devtools-ios/bin/` (arm64 macOS, installed separately via `npx @swmansion/argent install`)
|
|
|
|
---
|
|
|
|
## Setting up the dev environment
|
|
|
|
1. **Fork and clone** the repository:
|
|
|
|
```bash
|
|
git clone https://github.com/software-mansion/argent.git
|
|
cd argent
|
|
```
|
|
|
|
2. **Install dependencies** (npm workspaces installs all packages at once):
|
|
|
|
```bash
|
|
npm install
|
|
```
|
|
|
|
3. **Start the dev environment:**
|
|
|
|
```bash
|
|
npm run dev
|
|
```
|
|
|
|
This builds the native devtools dylibs (if the private submodule is available, otherwise uses pre-built binaries), compiles the MCP TypeScript, patches `~/.claude.json` to point at the local MCP, and starts the tool-server from source via `ts-node`. Press `Ctrl+C` to stop — the script automatically restores your global Argent configuration.
|
|
|
|
To use a different port:
|
|
|
|
```bash
|
|
PORT=4000 npm run dev
|
|
```
|
|
|
|
> **Note:** `packages/argent-private` is a private git submodule that holds the ObjC source for the native devtools dylibs. If you don't have SSH access to it, `npm run dev` will use the pre-built dylibs committed to the repository — everything else works normally.
|
|
|
|
That's it, no separate install steps per package are needed, except `packages/docs`. It is excluded from the workspace glob and keeps its own lockfile, so `npm run lint` from the root needs `npm install` run inside `packages/docs` first.
|
|
|
|
---
|
|
|
|
## Project structure
|
|
|
|
This is an npm workspaces monorepo. All packages live under `packages/`:
|
|
|
|
| Package | Path | Purpose |
|
|
| ----------------------------- | ------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
|
| `@argent/registry` | `packages/registry` | Core library: dependency-aware service lifecycle, blueprints, tools, URNs |
|
|
| `@argent/tool-server` | `packages/tool-server` | HTTP API over the registry (port 3001). Registers all blueprints and tools |
|
|
| `@swmansion/argent` | `packages/argent` | Published bin shell — minimal dispatcher + bundled subcommands + native runtime assets |
|
|
| `@argent/tools-client` | `packages/argent-tools-client` | HTTP client + tool-server launcher shared by `@argent/mcp` and `@argent/cli` |
|
|
| `@argent/mcp` | `packages/argent-mcp` | MCP stdio protocol adapter — proxies Claude/Cursor calls to the tool-server |
|
|
| `@argent/cli` | `packages/argent-cli` | Shell CLI commands: `argent run`, `argent tools`, `argent server`, `argent enable`, `argent disable`, `argent flags` |
|
|
| `@argent/installer` | `packages/argent-installer` | Workspace setup logic: `argent init`, `update`, `uninstall` |
|
|
| `@argent/skills` | `packages/skills` | Markdown skill files (prefixed `argent-*`) that instruct AI agents how to use Argent tools |
|
|
| `@argent/native-devtools-ios` | `packages/native-devtools-ios` | Pre-built dylibs for iOS simulator injection (view hierarchy, network inspection). ObjC source lives in `packages/argent-private` _(private submodule)_ |
|
|
|
|
The `tsconfig.json` at the root uses TypeScript project references; `tsconfig.base.json` holds shared compiler options (`strict`, `ES2022`, etc.).
|
|
|
|
---
|
|
|
|
## Building
|
|
|
|
### Local development (recommended)
|
|
|
|
```bash
|
|
npm run dev
|
|
```
|
|
|
|
Builds everything and starts the tool-server from source. See [Setting up the dev environment](#setting-up-the-dev-environment) for details.
|
|
|
|
### Full build
|
|
|
|
Build all packages at once using TypeScript project references:
|
|
|
|
```bash
|
|
npm run build
|
|
```
|
|
|
|
To build a specific package:
|
|
|
|
```bash
|
|
npm run build -w @argent/registry
|
|
npm run build -w @argent/tool-server
|
|
```
|
|
|
|
To build and bundle the distributable MCP package:
|
|
|
|
```bash
|
|
npm run build -w @swmansion/argent
|
|
# or, to also produce a .tgz tarball:
|
|
npm run pack:mcp
|
|
```
|
|
|
|
---
|
|
|
|
## Running the project
|
|
|
|
For day-to-day development, use `npm run dev` (see [Setting up the dev environment](#setting-up-the-dev-environment)).
|
|
|
|
**Production-like start** (builds bundles first, then starts from compiled output):
|
|
|
|
```bash
|
|
npm run start
|
|
```
|
|
|
|
This builds the registry, then starts the tools server on port 3001.
|
|
|
|
Verify the tools server is up:
|
|
|
|
```bash
|
|
curl http://localhost:3001/tools
|
|
```
|
|
|
|
---
|
|
|
|
## Running tests
|
|
|
|
Tests are written with [Vitest](https://vitest.dev/). Each package has its own test suite.
|
|
|
|
Run tests for a specific package:
|
|
|
|
```bash
|
|
npm test -w @argent/registry
|
|
npm test -w @argent/tool-server
|
|
```
|
|
|
|
Run tests in watch mode during development:
|
|
|
|
```bash
|
|
npm run test:watch -w @argent/registry
|
|
npm run test:watch -w @argent/tool-server
|
|
```
|
|
|
|
---
|
|
|
|
## Code style
|
|
|
|
- **TypeScript strict mode** is enabled across all packages (`"strict": true` in `tsconfig.base.json`). All code must compile without errors.
|
|
- **Target:** ES2022 with CommonJS modules (except `@swmansion/argent` which uses ESM).
|
|
- Prefer explicit types over `any`. Use Zod schemas for runtime validation where the codebase already does so.
|
|
- Keep commits focused. Prefix commit messages with a type: `feat:`, `fix:`, `chore:`, `docs:`, `refactor:`, `test:`. This feeds the auto-generated changelog on release.
|
|
|
|
---
|
|
|
|
## Submitting a pull request
|
|
|
|
1. **Create a branch** from `main` with a descriptive name (e.g. `feat/add-screenshot-tool`, `fix/session-leak`).
|
|
2. **Make your changes.** Keep the scope of a PR small and focused — it's easier to review.
|
|
3. **Ensure the build passes:**
|
|
```bash
|
|
npm run build
|
|
```
|
|
4. **Ensure tests pass** for the packages you touched.
|
|
5. **Check for dead code**, in a tree with no build output:
|
|
```bash
|
|
npx tsc --build --clean
|
|
npm run knip
|
|
```
|
|
Run it this way round, not straight after step 3. The `--max-issues` ceiling is counted against an unbuilt tree, because that is what CI analyses; with `packages/*/dist` present knip finds fewer issues, so a built-tree run carries phantom headroom and can pass locally while the Dead Code job fails. This leaves the tree unbuilt, so run `npm run build` again before re-running any test suite. If your change legitimately adds an export nothing imports yet, raise the `--max-issues` number in the same commit rather than deleting someone else's backlog — the bump is the part reviewers should see.
|
|
6. **Write a clear PR title** — it becomes part of the release changelog. Use the same prefix convention as commit messages (`feat:`, `fix:`, etc.).
|
|
7. **Open the PR** against `main` and fill in the description with context on what changed and why.
|
|
8. A maintainer will review and may request changes. Address feedback with new commits (don't force-push after review starts).
|
|
|
|
---
|
|
|
|
## Questions?
|
|
|
|
If you're unsure about something, open a GitHub Discussion or leave a comment on the relevant issue before spending time on a large change.
|