Shopify Hydrogen Skills

Agent skills for building, maintaining, and upgrading Shopify Hydrogen storefronts with Weaverse. Works with Claude Code, Cursor, GitHub Copilot, Windsurf, OpenCode, OpenClaw, Gemini CLI, and any agent that supports markdown skill files.

Why skills, not docs? Skills are concise, agent-optimized knowledge that your coding agent loads before working on a task — structured for LLMs, not humans. Pair them with Weaverse MCP for live doc search and the best results.

Quick Install

npx skills add Weaverse/shopify-hydrogen-skills

Auto-detects your coding agents and installs to all of them. Powered by skills.sh. Or ask your coding agent to start a project with the skills:

Install the Weaverse Shopify Hydrogen agent skills with npx skills add Weaverse/shopify-hydrogen-skills. Then load the setup-weaverse-project skill and use it to create a new Weaverse Hydrogen storefront from the Pilot theme, run it locally, and connect it to Weaverse Studio. Ask me for my Weaverse project ID and Shopify store credentials when you need them.

Open in Cursor

For manual per-agent setup, see the INSTALL.md.

Available Skills

setup-weaverse-project

The front door — take a project from nothing to a running, connected storefront. Scaffolds with the Weaverse CLI, generates SESSION_SECRET, boots a live demo-store preview before credentials, then makes it yours: env, GitHub repo, dev server, preview connection. Load when starting a brand-new project or running a theme locally for the first time.

shopify-hydrogen

Core Hydrogen APIs — createHydrogenContext, cart handler, caching, pagination, SEO, CSP. Load when working with @shopify/hydrogen APIs.

weaverse-hydrogen

Weaverse components, schemas, loaders, theming, deployment. Load for any Hydrogen + Weaverse project.

hydrogen-cookbooks

Step-by-step guides — bundles, combined listings, 3D models, customer accounts, performance. Load when building specific features.

hydrogen-upgrades

Breaking changes and migration steps for Hydrogen framework versions. Load when upgrading Hydrogen.

theme-update

Safe Pilot theme updates — detect version, plan changes, preserve customizations, verify build. Load when updating a customer’s Pilot theme.

weaverse-integration

Integrate Weaverse into an existing Hydrogen project — analyze codebase, convert components, set up SDK, configure routes. Load when adding Weaverse to a project that doesn’t use it yet.

Live Doc Fetching

Instead of baking static API docs into skill files (which go stale), this repo ships live doc fetching scripts that query official sources at runtime:

# Search Shopify Hydrogen docs (shopify.dev)
node scripts/search_shopify_docs.mjs "createHydrogenContext"
node scripts/search_shopify_docs.mjs "CartForm actions"

# Search Weaverse docs (docs.weaverse.io)
node scripts/search_weaverse_docs.mjs "component schema"

# Fetch a specific Weaverse doc page
node scripts/get_weaverse_page.mjs "development-guide/component-schema"

# Check for Pilot theme updates
node skills/theme-update/scripts/check_pilot_updates.mjs

Script	Source	What it does
`search_shopify_docs.mjs`	shopify.dev	Search Hydrogen API docs
`search_weaverse_docs.mjs`	docs.weaverse.io	Search Weaverse docs via Mintlify MCP
`get_weaverse_page.mjs`	docs.weaverse.io	Fetch full page content by path
`check_pilot_updates.mjs`	github.com	Check for Pilot theme release updates

All scripts are zero-dependency — Node.js 18+ built-ins only. The references/ folders in each skill serve as offline fallback — cached snapshots for when live search is unavailable.

Repo Structure

skills

shopify-hydrogen

SKILL.md

references

weaverse-hydrogen

references

examples

hydrogen-cookbooks

references

hydrogen-upgrades

references

theme-update

SKILL.md

scripts

weaverse-integration

SKILL.md

scripts

.cursorrules

AGENTS.md

INSTALL.md

Each skill keeps its deep-dive guides in references/. scripts/ holds the shared live doc fetching scripts, and INSTALL.md covers manual per-agent setup.

Using with Weaverse MCP

For the best development experience, combine agent skills with Weaverse MCP:

Skills provide structured knowledge your agent loads before tasks
MCP provides real-time doc search plus account access: read projects, pages, theme settings, and locales — and edit page content, theme settings, and project names

Together, your AI coding agent has both deep context and live access to the latest documentation.

Contributing

PRs welcome — especially for:

New cookbooks (feature implementation guides)
Upgrade guides for newer Hydrogen versions
Improved offline references
New live doc scripts for other sources

Weaverse/shopify-hydrogen-skills

Overview

Developer Tools

APIs

Hydrogen Integrations

Migration

Shopify Hydrogen Skills

Shopify Hydrogen Skills

Quick Install

Available Skills

setup-weaverse-project

shopify-hydrogen

weaverse-hydrogen

hydrogen-cookbooks

hydrogen-upgrades

theme-update

weaverse-integration

Live Doc Fetching

Repo Structure

Using with Weaverse MCP

Contributing

​Shopify Hydrogen Skills

​Quick Install

​Available Skills

setup-weaverse-project

shopify-hydrogen

weaverse-hydrogen

hydrogen-cookbooks

hydrogen-upgrades

theme-update

weaverse-integration

​Live Doc Fetching

​Repo Structure

​Using with Weaverse MCP

​Contributing

Shopify Hydrogen Skills

Quick Install

Available Skills

Live Doc Fetching

Repo Structure

Using with Weaverse MCP

Contributing