Which AI agents work with aem-eds-kit?

Claude Code, Cursor and Codex. Force one with --agent, or use --agent none to just save the prompt. Deterministic commands (scaffold, migrate, audits) need no agent at all.

aem-eds-kit - CLI for AEM Edge Delivery Services (EDS)

Q: Does aem-eds-kit add anything to my site?

No. It is a dev tool only - zero bytes in your bundle, zero LCP impact.

02 / Commands

Everything around the dev server.

Run it from anywhere inside an EDS project - eds finds the root (fstab.yaml, head.html or scripts/). Every command supports --json.

initSet up a cloned boilerplate: authoring model, fstab, CI, .env, xwalk.json.

template new <name>Generate page initial content + push to DA (da.live).

sandbox new <name>Spin up (and tear down) a disposable EDS repo on GitHub.

block from-design <url>Figma, Framer or Stitch → block JS, CSS and UE model.

migrate component <dir>Classic AEM dialog → EDS block + Universal Editor model.

ue check · open <path>Universal Editor readiness, then open a page in the editor.

track block <name>Add dataLayer click + form-submit tracking to a block.

model add <block>Compose reusable field-group partials into a block's UE model.

schema block <name>Inject JSON-LD (schema.org) structured data into a block.

scaffold ...UE config, standard blocks, CI, helpers, .env, xwalk.json.

block create <name>Scaffold a block, authorable in UE from day one.

block preview [name]Width-honest preview at the design's breakpoints - or a live gallery of all blocks with no name.

block test [name]Visual regression vs committed baselines; --design diffs the render against the Figma image.

block check [name]Content, link and a11y check on the rendered DOM (alt, CLS, accessible names).

block listEvery block, its files and Figma source.

figma setupDetect agents, check Figma MCP, save prefs.

preview · publish <path>Pages via the AEM Admin API, config from .edsrc.json.

doctor · auditProject health, loading strategy, security.

03 / Audits

Catch it before review does.

Three checks, one habit. Run them locally or wire them into CI - security exits non-zero on critical and high findings.

$ eds doctor Project health.

✔fstab.yaml exists and is valid

✔Every block has its .js file

✔Every block has a UE model

✔No console.log in block code

✔Figma blocks synced in the last 30 days

$ eds audit loading Three-phase loading and LCP budget.

✔Nothing render-blocking in head.html

✔Eager phase loads only the first section

✔styles.css within budget, no @import chains

✔No jQuery, GSAP or Swiper in blocks

✔Block CSS scoped to .block-name

$ eds audit security Vulnerabilities and exploit patterns.

✔npm audit, summarized by severity

✔eval, new Function, document.write

✔Dynamic innerHTML and javascript: URLs

✔Hardcoded secrets and private keys

✔Mixed content, tabnabbing, postMessage('*')

04 / With @adobe/aem-cli

Keep your dev server. Add the workflow.

@adobe/aem-cli Runs your site locally. The local dev server for Edge Delivery. Still the right tool for that job.

aem-eds-kit Handles everything around it.

Design → block Scaffolding UE models Block preview Preview / publish Audits

05 / Quick start

Three commands to your first block.

1 · Install globally

$ npm i -g aem-eds-kit

2 · Connect your agent to Figma MCP

$ eds figma setup

3 · Generate a block

$ eds block from-design "<url>"

No Figma file yet? Add --dry-run to see the generated prompt without running an agent.

Or let your AI agent set it up

Copy the setup prompt and paste it into Claude, Cursor, or any coding agent. It checks Node, installs the CLI with npm, pnpm or yarn, and verifies it.

Goal:
Ensure Node.js v20 or newer is installed, then install the aem-eds-kit CLI and verify it.

Check first:
Run `node --version`.

If Node.js is already installed and the major version is 20 or higher:
Do not install or modify Node.js. Continue to the aem-eds-kit install.

If Node.js is missing or older than v20:
Install an official Node.js release with major version 20 or higher.

Install policy:
Use an existing package manager only if it is already installed.
Do not install Homebrew, winget, Chocolatey, Scoop, nvm, fnm, or another package manager just for this task.

Install options:
macOS:
- If Homebrew is already installed, use it to install Node.js.
- Otherwise use the official Node.js `.pkg` installer.
Windows:
- If winget is already installed, use it to install Node.js.
- Otherwise use the official Node.js `.msi` installer.
Linux:
- If the system package manager can install Node.js v20 or newer, use it.
- For Debian/Ubuntu or RHEL/Fedora-compatible systems, use the official NodeSource instructions for Node.js 20 or newer.
- Otherwise use the official Node.js standalone Linux binary for the detected architecture.

Official downloads:
Use the static latest Node.js release directory:
https://nodejs.org/download/release/latest/

Verify Node:
After installing, run `node --version` again.
Only continue if the major version is 20 or higher.

Install the CLI:
Use the package manager the user already works with. Check `pnpm --version` and `yarn --version`; if neither is installed, use npm (it ships with Node.js). Do not install pnpm or yarn just for this task.
- npm: `npm install -g aem-eds-kit`
- pnpm: `pnpm add -g aem-eds-kit` (if it reports a missing global bin directory, run `pnpm setup`, restart the shell, and retry)
- yarn 1.x: `yarn global add aem-eds-kit`
- yarn 2 or newer has no global installs - use npm instead.

Verify:
Run `eds --version`.
Only continue if it prints a version.

Final step:
From inside an EDS project (a folder with fstab.yaml, head.html, or scripts/scripts.js), run `eds` for the interactive menu, or `eds init` to set up a freshly cloned Adobe EDS boilerplate.

Success message:
If everything completes, tell the user they are set up and what to do next:
- Just cloned the Adobe EDS boilerplate? Run `eds init` and pick the authoring model (Universal Editor, DA, Google Drive, or SharePoint).
- Want a block from a design? Run `eds block from-design` and paste a Figma URL, or a Framer/Stitch page.

06 / Roadmap

Where it's heading.

Design sources Figma (REST/MCP), Framer and Google Stitch (headless-Chromium scrape) are wired; next is a deeper scrape extractor (multi-breakpoint, variant detection) and a generic eds setup in place of eds figma setup. Canva/Sketch stay on the local-export path.

Screenshot → block Build a block from a plain image - harder, since there's no structured layout or measurements, so pixel-perfect is tougher.

Tokens, sync & CI Design variables → CSS custom properties, incremental re-sync of a block (--update), a headless MCP client for CI/CD, plus eds lighthouse, eds rum and eds migrate page.

07 / FAQ

Questions, answered.

Does it add anything to my site?−

No. It's a dev tool only - zero bytes in your bundle, zero LCP impact.

Do I need a Figma API token?+

No - by default your AI agent reads the design through its Figma MCP connection (one call per block, then cached). Optionally set a Figma Personal Access Token (FIGMA_TOKEN) to use the REST API instead: a separate, far larger quota than the MCP tool-call limit, so it works comfortably on Starter or Collab seats.

Which agents work?+

Claude Code, Cursor and Codex. Force one with --agent, or use --agent none to just save the prompt.

Does it replace @adobe/aem-cli?+

No - it complements it. aem-cli runs the dev server; eds handles scaffolding, Figma, audits and publishing around it.

Can I run it in CI?+

Yes. Every command supports --json, and audit security exits non-zero on critical or high findings.

Design frame in.
EDS block out

Fetch once, cache, generate. No API key required to start.