Getting Started

Introduction

Welcome to the Nuxt Shopify documentation

Welcome to Nuxt Shopify, a Nuxt module integration for Shopify's e-commerce capabilities.

Overview

Nuxt Shopify is designed to seamlessly integrate Shopify's powerful APIs into your Nuxt application. To make development easier, the module automatically generates TypeScript types from your GraphQL operations, hot-reloads on any changes made, auto-imports your GraphQL fragments, provides an easy, pre-configured mock.shop integration, and much more.

No manual type definitions or complex codegen setup required.

Storefront API

Use the Storefront API to query your Shopify store

Admin API

Use the Admin API to manage your Shopify store

Module configuration

Read up on the module configuration reference

Automatic type generation

Generates types for your Shopify store automatically

Error Handling

Learn how to handle errors in your application

GraphiQL Sandbox

Use a pre-configured sandbox for testing

Key Features

  • TypeScript Support: Creates fully typed fetch clients from your GraphQL schemas
  • Hot-reloading: Hot-reloads types automatically when your GraphQL changes
  • Secure Access Token Handling: Ensures your access tokens are stored securely
  • Storefront and Admin API Support: Access both APIs with ease
  • Server & Client Side Support: Works seamlessly on both server and client side
  • Automatic Mock.shop Integration: Easily integrate with mock.shop for testing
  • Built-in Error Handling: Optimized error handling for Nuxt applications
  • Server-side Proxy: Proxies API requests from the client through the Nitro server
  • GraphQL Fragments Support: Reuse GraphQL fragments across your queries
  • Customizable GraphQL Code Generation: Tailor the code generation to your needs
  • Auto-imports: Automatically imports your GraphQL fragments and generated types
  • Integrated Sandbox: Test your queries in a safe environment with GraphiQL
  • Lifecycle Hooks: Extend the module's functionality with ease