AgentSkillsCN

shopify-developer

完整的 Shopify 开发参考,涵盖 Liquid 模板、主题开发(OS 2.0)、GraphQL Admin API、Storefront API、自定义应用开发、Shopify Functions、Hydrogen、性能优化及调试。适用于处理 .liquid 文件、创建主题区块和区域、编写 Shopify 的 GraphQL 查询或突变、使用 CLI 和 Polaris 构建 Shopify 应用、通过 Ajax API 实现购物车操作、优化 Shopify 商店的 Core Web Vitals、调试 Liquid 或 API 错误、配置 settings_schema.json、访问 Shopify 对象(产品、系列、购物车、客户)、使用 Liquid 过滤器、创建应用扩展、使用 webhooks、从 Scripts 迁移到 Functions,或使用 Hydrogen 和 React Router 7 构建无头商店。涵盖 API 版本 2026-01。

SKILL.md
--- frontmatter
name: shopify-developer
description: Complete Shopify development reference for Liquid templating, theme development (OS 2.0), GraphQL Admin API, Storefront API, custom app development, Shopify Functions, Hydrogen, performance optimisation, and debugging. Use when working with .liquid files, creating theme sections and blocks, writing GraphQL queries or mutations for Shopify, building Shopify apps with CLI and Polaris, implementing cart operations via Ajax API, optimising Core Web Vitals for Shopify stores, debugging Liquid or API errors, configuring settings_schema.json, accessing Shopify objects (product, collection, cart, customer), using Liquid filters, creating app extensions, working with webhooks, migrating from Scripts to Functions, or building headless storefronts with Hydrogen and React Router 7. Covers API version 2026-01.

Shopify Developer Reference

Comprehensive reference for professional Shopify development - API version 2026-01.

Quick Reference

ItemValue
API version2026-01 (stable)
GraphQL AdminPOST https://{store}.myshopify.com/admin/api/2026-01/graphql.json
Storefront APIPOST https://{store}.myshopify.com/api/2026-01/graphql.json
Ajax API (theme)/cart.js, /cart/add.js, /cart/change.js
CLI installnpm install -g @shopify/cli
Theme devshopify theme dev --store {store}.myshopify.com
App devshopify app dev
Deployshopify app deploy
Docsshopify.dev

Choose Your Path

Read the reference file(s) that match your task:

Liquid templating - writing or debugging .liquid files:

Theme development - building or customising themes:

API integration - fetching or modifying data programmatically:

App development - building Shopify apps:

Serverless logic - custom business rules:

Headless commerce - custom storefronts:

Optimisation and troubleshooting:

Deprecation Notices

DeprecatedReplacementDeadline
Shopify ScriptsShopify FunctionsAugust 2025 (migration), sundown TBD
checkout.liquidCheckout ExtensibilityAugust 2024 (Plus), done
REST Admin APIGraphQL Admin APIActive deprecation (no removal date yet)
Legacy custom appsNew auth modelJanuary 2025 (done)
Polaris ReactPolaris Web ComponentsActive migration
Remix (app framework)React Router 7Hydrogen 2025.5.0+

Liquid Essentials

Three syntax types:

liquid
{{ product.title | upcase }}                    {# Output with filter #}
{% if product.available %}In stock{% endif %}   {# Logic tag #}
{% assign sale = product.price | times: 0.8 %}  {# Assignment #}
{%- if condition -%}Stripped whitespace{%- endif -%}

Key patterns:

liquid
{% for product in collection.products limit: 5 %}
  {% render 'product-card', product: product %}
{% endfor %}

{% paginate collection.products by 12 %}
  {% for product in paginate.collection.products %}...{% endfor %}
  {{ paginate | default_pagination }}
{% endpaginate %}

API Essentials

javascript
// GraphQL Admin - always use GraphQL over REST
const response = await fetch(
  `https://${store}.myshopify.com/admin/api/2026-01/graphql.json`,
  {
    method: 'POST',
    headers: {
      'X-Shopify-Access-Token': accessToken,
      'Content-Type': 'application/json',
    },
    body: JSON.stringify({ query, variables }),
  }
);
const { data, errors } = await response.json();
if (errors) throw new Error(errors[0].message);

// Ajax API (theme-only cart operations)
fetch('/cart/add.js', {
  method: 'POST',
  headers: { 'Content-Type': 'application/json' },
  body: JSON.stringify({ id: variantId, quantity: 1 }),
});

Reference Files

FileLinesCoverage
liquid-syntax.md~600Tags, control flow, iteration, variables, whitespace, LiquidDoc
liquid-filters.md~870String, numeric, array, Shopify-specific, date, URL, colour filters
liquid-objects.md~695All Shopify objects: product, variant, collection, cart, customer, order, etc.
theme-development.md~1200File structure, JSON templates, sections, blocks, settings schema, layout
api-admin.md~595GraphQL queries/mutations, REST (legacy), OAuth, webhooks, rate limiting
api-storefront.md~235Storefront API, Ajax API, cart operations, Customer Account API
app-development.md~760CLI, app architecture, extensions, Polaris Web Components, deployment
functions.md~300Function types, Rust/JS targets, CLI workflow, Scripts migration
hydrogen.md~375Setup, routing, data loading, Storefront API, deployment
performance.md~605Images, JS, CSS, fonts, Liquid, third-party scripts, Core Web Vitals
debugging.md~650Liquid, JavaScript, API, cart, webhook, theme editor troubleshooting