Comment configurer le Shopify AI Toolkit avec Cursor

Dernière mise à jour
•
Revu par un expert
•
5 min de lecture

Points clés

  • Le plugin Shopify s’installe avec une seule commande dans le Cursor Chat (/add-plugin shopify) ou en un clic depuis le Cursor Marketplace, et se met à jour automatiquement avec de nouvelles fonctionnalités.
  • L’installation manuelle des skills fonctionne, mais les schémas s’éloignent de la plateforme en direct avec le temps sans mises à jour manuelles.
  • Définissez OPT_OUT_INSTRUMENTATION=true avant votre première validation si vous travaillez avec du code propriétaire. Les payloads de validation incluent votre code par défaut.
  • La compréhension de la codebase par Cursor, associée à la validation des schémas du toolkit, est une combinaison puissante pour le développement Shopify.
  • Les opérations sur la boutique s’exécutent immédiatement sur votre boutique en ligne. Il n’y a pas d’étape de brouillon ni d’annulation.

Pour configurer le Shopify AI Toolkit dans Cursor, tapez /add-plugin shopify dans le Cursor Chat, ou installez-le depuis le Cursor Marketplace en un clic. Posez ensuite une question sur l’API Shopify dans le chat pour confirmer qu’il récupère bien la documentation actuelle.

Une fois installé, votre environnement Cursor a accès à la documentation Shopify actuelle, à la validation du code par rapport aux schémas d’API intégrés, et à la possibilité d’exécuter des opérations sur la boutique via la Shopify CLI.

Pour une analyse complète de ce que fait le toolkit, de son fonctionnement et des risques de gouvernance liés à l’exécution sur la boutique, consultez notre présentation du Shopify AI Toolkit.


Pourquoi nous faire confiance

Jacques a plus de 15 ans d’expérience en développement et a travaillé avec des centaines de boutiques Shopify. Nous créons Fudge, l’opérateur IA pour les boutiques Shopify, avec une note de 4.9 sur le Shopify App Store et un badge Built for Shopify. Nous utilisons ces outils au quotidien.


Prérequis

  • Cursor installé et en cours d’exécution
  • Node.js 18 ou supérieur, le minimum documenté par Shopify (node --version pour vérifier). Node 18 a atteint sa fin de vie en avril 2025, utilisez donc Node 20 LTS ou plus récent
  • Shopify CLI installé (requis pour les opérations sur la boutique)
  • Une boutique Shopify à laquelle se connecter (nécessaire uniquement si vous prévoyez d’exécuter des opérations sur la boutique)

Installation : méthode par plugin (recommandé)

La méthode par plugin est l’approche la plus simple et se met à jour toute seule avec les nouvelles capacités.

Étape 1 : Installer le plugin

Dans le Cursor Chat, exécutez la commande documentée par Shopify :

/add-plugin shopify

Ou installez le Shopify AI Toolkit directement depuis le Cursor Marketplace. C’est une installation en un clic.

Toutes les skills d’agent disponibles sont incluses automatiquement.

Étape 2 : Vérifier que ça fonctionne

Ouvrez le chat IA de Cursor et posez une question spécifique à Shopify :

What's the correct GraphQL mutation to create a new product in Shopify's Admin API?

Si le toolkit est actif, Cursor va extraire l’info depuis la documentation officielle de Shopify plutôt que depuis ses données d’entraînement. Vous verrez que les réponses contiennent des noms de champs précis et validés.


Alternative : installation manuelle des skills

Si votre configuration ne permet pas d’utiliser le plugin, ou si vous préférez gérer la skill vous-même, installez-la directement :

npx skills add Shopify/shopify-ai-toolkit

Cela installe l’unique skill shopify du toolkit, qui couvre toutes les surfaces de développement Shopify : l’API GraphQL Admin, Shopify Functions, Polaris, Liquid, Hydrogen et la Shopify CLI. Les versions précédentes proposaient une skill distincte par surface, comme shopify-admin et shopify-liquid. Celles-ci sont obsolètes et ne sont plus mises à jour, donc si vous en avez installé, supprimez-les (par exemple npx skills remove shopify-admin shopify-liquid) et installez la skill shopify à la place.

Les skills installées manuellement ne se mettent pas à jour automatiquement. Exécutez npx skills update régulièrement pour rester à jour avec les changements d’API de Shopify. Sinon, les schémas intégrés s’éloigneront de la plateforme en direct.


Alternative : Configuration du serveur MCP

Pour une intégration MCP directe, vous pouvez vous connecter au serveur Dev MCP de Shopify en ajoutant la configuration aux paramètres MCP de Cursor. Le serveur Dev MCP fonctionne comme une intégration locale serveur/client mais effectue des appels réseau vers les endpoints Shopify pour la recherche de documentation.

Dans Cursor, allez dans Cursor > Settings > Cursor Settings > Tools and MCP > New MCP server et ajoutez cette configuration, telle qu’indiquée dans la documentation du Shopify AI Toolkit :

{
    "mcpServers": {
        "shopify-dev-mcp": {
            "command": "npx",
            "args": ["-y", "@shopify/dev-mcp@latest"]
        }
    }
}

Enregistrez et redémarrez Cursor. Si vous rencontrez des erreurs de connexion sous Windows, la documentation de Shopify propose une alternative qui exécute la même commande via cmd /k.


Télémétrie et transmission de code

Avant de commencer à valider du code : validate.mjs et search_docs.mjs envoient tous deux des payloads d’utilisation aux serveurs de Shopify par défaut.

Les fichiers SKILL.md décrivent cela comme des “résultats de validation anonymisés (succès/échec et nom de la skill)”. Cependant, le payload de validation réel inclut le code en cours de validation - vos requêtes GraphQL, vos templates Liquid et tout autre code que vous passez dans le validateur.

Pour vous désinscrire (opt out), définissez cette variable d’environnement avant de lancer Cursor :

export OPT_OUT_INSTRUMENTATION=true

Si vous travaillez avec du code propriétaire ou client, définissez ceci avant votre première validation.


Connexion à votre boutique

Pour les opérations sur la boutique (pas seulement la génération et la validation de code), vous devez vous authentifier.

Flux d’authentification

Lorsque vous demandez une opération sur la boutique via Cursor, le toolkit déclenche :

shopify store auth --store yourstore.myshopify.com --scopes write_products,read_products

Cela ouvre une fenêtre de navigateur où vous autorisez la connexion via votre admin Shopify.

Scopes OAuth courants

Ce que vous voulez faireScope requis
Lire les données produitsread_products
Mettre à jour les produitswrite_products
Lire les niveaux de stockread_inventory
Ajuster le stockwrite_inventory
Lire les infos de commanderead_orders
Accéder aux données clientsread_customers

Utilisez toujours le minimum de scopes nécessaires. Le script de validation du toolkit détecte ce qui est requis pour chaque opération, mais write_products accorde tout de même l’accès à TOUTES les opérations d’écriture sur les produits, et pas seulement à la mutation spécifique que vous exécutez.


Ce que vous pouvez faire avec Cursor + Shopify AI Toolkit

Génération de code validé

Le plus grand avantage immédiat : Cursor arrête de deviner les API Shopify.

Sans le toolkit, Cursor pourrait générer du GraphQL avec des champs obsolètes, des types incorrects ou des mutations inexistantes basées sur des données d’entraînement périmées. Avec le toolkit, chaque requête et mutation est validée par rapport au schéma d’API Shopify intégré.

Utiliser le contexte de la codebase de Cursor

Cursor excelle dans la compréhension de l’ensemble de votre projet. Combinez le toolkit Shopify avec la connaissance de la codebase de Cursor :

Regarde comment j'ai structuré les autres requêtes de produits dans ce projet et écris-en une nouvelle pour récupérer les recommandations de produits, validée par rapport à l'API Shopify actuelle

Développement de thèmes

Travaillez avec des templates Liquid avec une validation par rapport aux règles de thème de Shopify - y compris les blocs de schéma et les en-têtes LiquidDoc.

Storefronts Hydrogen

Créez des storefronts headless avec des composants React validés et des imports corrects.

Opérations sur la boutique

Exécutez des opérations directement sur votre boutique connectée. Toute opération sur la boutique qui écrit des données s’exécute immédiatement sur votre boutique en ligne. Il n’y a pas d’étape de brouillon. Consultez l’analyse complète des risques pour comprendre pourquoi c’est important.

Gestion des metafields

Étendez le modèle de données de votre boutique avec des définitions de metafields et des données personnalisées.

Fonctions et extensions

Créez des personnalisations backend - réductions, validation de panier, règles de livraison - et générez des extensions d’interface utilisateur (UI).

Pour des exemples pratiques sur les thèmes, consultez Comment ajouter une logique Liquid personnalisée dans Shopify.


Bonnes pratiques pour les utilisateurs de Cursor

1. Interrogez avant de muter

Lisez toujours l’état actuel avant d’apporter des modifications :

D'abord, montre-moi les données actuelles du produit pour le handle "summer-collection-tee", puis mets à jour uniquement la description

2. Soyez explicite sur la portée (scope)

Les requêtes vagues entraînent des mutations trop larges. Soyez précis :

Trop vague :

Mets à jour mes produits pour un meilleur SEO

Mieux :

Mets à jour la meta description pour le handle de produit "classic-tee" avec : "T-shirt classique en coton premium. Disponible en 5 couleurs. Livraison gratuite pour les commandes de plus de 50 $."

3. Poussez les thèmes comme non publiés

Le toolkit prend en charge --unpublished pour les pushs de thèmes, mais vous devez le demander explicitement. Ce n’est pas appliqué par défaut.

4. Ajoutez une règle de projet

Créez .cursor/rules/shopify.mdc avec des instructions spécifiques à Shopify. Cursor considère .cursorrules comme obsolète au profit des règles de projet :


---

description: Règles de développement Shopify
alwaysApply: true

---

Lors de l'écriture de GraphQL Shopify :
- Valide toujours par rapport au schéma actuel de l'API Admin
- Utilise la skill shopify pour les requêtes API
- Privilégie les opérations de lecture par défaut, sauf si une mutation est explicitement demandée
- Pour les mutations, interroge toujours l'état actuel en premier
- Pour les pushs de thèmes, utilise toujours le flag --unpublished

5. Toujours revoir les mutations générées avant de les valider

Lorsque Cursor génère une mutation pour la boutique, relisez-la avant de l’approuver. Vérifiez :

  • Cible-t-elle le bon produit/la bonne ressource ?
  • L’étendue de la modification correspond-elle à ce que vous vouliez (1 produit vs tous les produits) ?
  • Les valeurs des champs existants sont-elles conservées ou écrasées ?

Limitations

Ces contraintes sont liées à la structure du toolkit, pas à Cursor. Pour une analyse complète du risque, voir notre présentation du Shopify AI Toolkit.

  1. Zéro environnement de brouillon - Les mutations de boutique sont propulsées publiquement de suite.
  2. Pas d’aperçu de pre-rendu - Vous ne pouvez pas savoir à quoi s’attendre au visuel final.
  3. Pas de retour en arrière/annulation - Les modifications sont à sens unique.
  4. Zéro piste d’audit - Rien au sein du toolkit ne se souvient de ce qui a bougé.
  5. Périmètres globaux - Les permissions OAuth sont sur un secteur complet et ne différencient pas les éléments unitaires.
  6. Du code est poussé vers Shopify - Les payloads de validation incluent votre code par défaut (OPT_OUT_INSTRUMENTATION=true pour s’en soustraire).
  7. Déclin des skills en manuel - Sans l’appli en plugin, les mises à jour en manuel nécessitent votre intervention.

Où Fudge intervient

Le AI Toolkit vous permet d’écrire du code Shopify plus rapidement : schémas, thèmes, Hydrogen, applications personnalisées. Ce n’est pas l’outil adapté pour l’équipe merchandising qui gère les opérations quotidiennes, et il n’ajoute pas le workflow dont les vraies modifications de boutique ont besoin : brouillons, aperçus, approbations, historique des versions, rollbacks. Le code vit dans git ; l’état de la boutique, non.

C’est ce vide que Fudge vient combler. En tant qu’opérateur IA pour les boutiques Shopify, il offre à votre équipe un workflow IA clé en main, plutôt que quelque chose que vous devez concevoir et maintenir dans Cursor. Fudge suggère ce qui vaut la peine d’être modifié, prépare chaque changement sous forme de brouillon dans votre thème via son éditeur de boutique, montre qui a publié quoi, et compare les chiffres sur la page avant et après.

Gardez Cursor pour le code que vous écrivez vous-même.


En bref

TâcheComment
Installer le plugin/add-plugin shopify dans le Cursor Chat, ou en un clic depuis le Marketplace
Installer toutes les skills manuellementnpx skills add Shopify/shopify-ai-toolkit
Mettre à jour les skills manuellesnpx skills update
S’authentifier avec la boutiqueAutomatique lors de la première opération sur la boutique
Se désinscrire de la télémétrieexport OPT_OUT_INSTRUMENTATION=true
Vérifier la version de Nodenode --version (18+ requis, 20 LTS recommandé)

Pour avoir une vue d’ensemble des risques et de la gouvernance, lisez notre présentation du Shopify AI Toolkit. Pour la configuration sur d’autres plateformes, consultez notre guide Claude Code et notre guide OpenAI Codex.

Nous avons revérifié les commandes de cette page par rapport à la documentation de Shopify pour la dernière fois en octobre 2026.


FAQ

Quel est l'avantage de Cursor + Shopify AI Toolkit par rapport aux autres outils d'IA ?

La compréhension de la codebase par Cursor est ce qui fait la différence — il peut raisonner sur la structure, les conventions et les modèles de votre projet existant lors de l'écriture d'un nouveau code Shopify. Associé à la validation des schémas du toolkit, Cursor arrête de deviner à la fois votre codebase et les API de Shopify. Cette combinaison produit un code plus cohérent que l'un ou l'autre de ces outils utilisé seul.

Dois-je commiter mes règles de projet Cursor dans le repo ?

Oui. Les règles de projet dans .cursor/rules/ sont des configurations au niveau du projet qui profitent à toute l'équipe. Les commiter signifie que toute personne travaillant sur le projet obtient automatiquement le même comportement de Cursor adapté à Shopify. Utilisez les règles de projet pour les conventions du projet et les paramètres de Cursor (non commités) pour les préférences personnelles comme les choix d'interface.

Cursor conserve-t-il l'authentification à la boutique Shopify d'une session à l'autre ?

Oui — les tokens d'authentification sont gérés par la Shopify CLI, et non par Cursor. Une fois authentifié, le token persiste dans la configuration de la CLI jusqu'à son expiration ou sa révocation manuelle. L'historique des discussions de Cursor est distinct de l'état d'authentification — effacer l'historique des discussions ne vous déconnecte pas.

Puis-je utiliser le Toolkit Shopify dans le mode agent (autonome) de Cursor ?

Oui. Le mode agent peut appeler les outils de validation et de documentation de la même manière que le mode chat. Soyez plus prudent avec les mutations en mode agent — les boucles autonomes peuvent amplifier les erreurs. Utilisez des prompts spécifiques et bien ciblés, et exigez une confirmation explicite avant toute action modifiant la boutique.

Le Toolkit Shopify entrera-t-il en conflit avec d'autres extensions Cursor ?

Généralement non — les extensions sont isolées. Le Toolkit Shopify fonctionne via les protocoles MCP/outils de Cursor, qui sont conçus pour coexister avec d'autres extensions d'outils. Si vous rencontrez des conflits, vérifiez si plusieurs extensions sont en concurrence pour gérer la même catégorie de prompt — désactivez-en une pour tester.

Jacques's signature
Modifiez votre storefront Shopify sans code.

You might also be interested in

Jacques Blom
Jacques Blom
CTO chez Fudge.