# How OpenCode Integrates with the Cloning Workflow in AI Website Cloner

> Discover how OpenCode integrates with the AI Website Cloner workflow. Learn about build-time synchronization and native argument expansion for consistent multi-agent behavior.

- Repository: [JCodesMore/ai-website-cloner-template](https://github.com/JCodesMore/ai-website-cloner-template)
- Tags: how-to-guide
- Published: 2026-07-04

---

**OpenCode integrates with the cloning workflow through a build-time synchronization script that converts the canonical skill definition into a YAML-fronted markdown command file, enabling native argument expansion and consistent multi-agent behavior.**

The JCodesMore/ai-website-cloner-template repository treats **OpenCode** as a first-class AI coding agent within its website cloning pipeline. Rather than maintaining separate documentation for each agent, the repository uses a single source of truth pattern that automatically generates OpenCode-compatible command files from the master skill definition.

## The Single Source of Truth Architecture

### Master Skill Definition Location

The canonical description of the `/clone-website` skill lives in [`/.claude/skills/clone-website/SKILL.md`](https://github.com/JCodesMore/ai-website-cloner-template/blob/main//.claude/skills/clone-website/SKILL.md). This file serves as the sole source of truth for all supported AI agents, including OpenCode. When the skill logic changes—whether adding new cloning phases or updating defaults—this is the only file that requires manual editing.

## Build-Time Synchronization via sync-skills.mjs

### How the Script Generates OpenCode Commands

The `scripts/sync-skills.mjs` file parses the master skill definition and writes platform-specific copies. For OpenCode, it generates a markdown file with YAML front-matter that the OpenCode CLI consumes directly.

```javascript
// scripts/sync-skills.mjs – Open Code block
// 6. OpenCode — markdown + YAML frontmatter, $ARGUMENTS works natively
write(
  '.opencode/commands/clone-website.md',
  `---\ndescription: "${shortDesc}"\n---\n${HEADER}${body}`
);

```

The `write` function call above is the exact mechanism that creates the OpenCode command. The comment explicitly notes that **$ARGUMENTS works natively**, meaning OpenCode requires no additional preprocessing for argument handling.

## The Generated OpenCode Command Structure

### YAML Front-Matter Requirements

After running the sync script, the file [`/.opencode/commands/clone-website.md`](https://github.com/JCodesMore/ai-website-cloner-template/blob/main//.opencode/commands/clone-website.md) contains the YAML headers that OpenCode expects, followed by the full skill body.

```markdown
---
description: "Reverse-engineer and clone any website as a pixel-perfect replica"
---
<!-- AUTO-GENERATED from .claude/skills/clone-website/SKILL.md — do not edit directly.
     Run `node scripts/sync-skills.mjs` to regenerate. -->

# Clone Website

…

```

The first three lines contain the mandatory YAML front-matter. The comment block warns against direct editing and points back to the sync script for regeneration.

### Native $ARGUMENTS Handling

Unlike other agents that require custom preprocessing, OpenCode expands `$ARGUMENTS` automatically at runtime. This means the sync script can pass the raw skill body directly without modifying placeholder syntax, ensuring the exact same instructions execute across all agent platforms.

## Runtime Execution and Invocation

### Running the Sync Script

To update or create the OpenCode command file after modifying the master skill, execute the build pipeline:

```bash
npm run build          # ensure the repo compiles

node scripts/sync-skills.mjs   # regenerates .opencode/commands/clone-website.md

```

### Invoking the Skill from OpenCode

With the command file in place, any OpenCode client (CLI, VS Code extension, or web UI) can invoke the skill exactly like other agents:

```bash
opencode /clone-website https://example.com

```

The OpenCode runtime reads the YAML front-matter, presents the description to the user, and feeds the markdown body (including `$ARGUMENTS`) to the LLM. The skill then drives the multi-phase cloning pipeline: reconnaissance, foundation, spec generation, parallel build, and QA.

## Why This Integration Pattern Matters

Because OpenCode understands `$ARGUMENTS` without extra preprocessing, the same skill definition works across all supported agents. The sync script guarantees that any update to the master skill propagates automatically to the OpenCode command file, keeping behavior consistent and eliminating drift between agent implementations.

## Summary

- **Single source of truth**: The master skill definition lives in [`/.claude/skills/clone-website/SKILL.md`](https://github.com/JCodesMore/ai-website-cloner-template/blob/main//.claude/skills/clone-website/SKILL.md).
- **Automated generation**: `scripts/sync-skills.mjs` creates OpenCode-specific files at [`/.opencode/commands/clone-website.md`](https://github.com/JCodesMore/ai-website-cloner-template/blob/main//.opencode/commands/clone-website.md).
- **Native argument support**: OpenCode expands `$ARGUMENTS` automatically without requiring preprocessing.
- **Consistent execution**: The sync script ensures all agents receive identical skill updates simultaneously.
- **Runtime access**: Users invoke the skill via `opencode /clone-website <url>` after sync completes.

## Frequently Asked Questions

### What file serves as the source of truth for the clone skill?

The master skill definition lives in [`/.claude/skills/clone-website/SKILL.md`](https://github.com/JCodesMore/ai-website-cloner-template/blob/main//.claude/skills/clone-website/SKILL.md). This single file contains the canonical instructions that get synchronized to all AI agents, including OpenCode.

### How does OpenCode handle command arguments differently from other agents?

OpenCode natively expands the `$ARGUMENTS` placeholder at runtime. While other agents might require custom preprocessing or different variable syntax, OpenCode consumes the raw markdown body directly and substitutes arguments automatically during execution.

### How do I regenerate the OpenCode command file after updating the skill?

Run `node scripts/sync-skills.mjs` from the repository root. This parses the updated master skill and writes a fresh copy to [`/.opencode/commands/clone-website.md`](https://github.com/JCodesMore/ai-website-cloner-template/blob/main//.opencode/commands/clone-website.md) with the correct YAML front-matter and body content.

### Where is the generated OpenCode command file located?

The synchronized command file is written to [`/.opencode/commands/clone-website.md`](https://github.com/JCodesMore/ai-website-cloner-template/blob/main//.opencode/commands/clone-website.md) within the repository structure. This path follows OpenCode's convention for custom commands, allowing the CLI to discover and execute the skill automatically.