Get unlimited public & private packages + team-based management with npm Teams.Learn more »


0.0.12 • Public • Published

Craft CMS (GraphQL) source for Gridsome

This package is under development. The API might change before v1 is released.

Requires Gridsome v0.7.12 or later

A more detailed write up is on my site

Gridsome setup


Yarn: yarn add @bhws/gridsome-source-craft-graphql Or, NPM: npm install @bhws/gridsome-source-craft-graphql


Add \[CraftPreviewSlug\].vue to your projects .gitignore file. These files are for live preview and shouldn't be added to your git repo.

Source plugin

module.exports = {
  plugins: [
      use: '@bhws/gridsome-source-craft-graphql',
      options: {
        url: '',
        fieldName: 'craft',
        typeName: 'craft',
        livePreview: true,
  • url - String required
    The URL of a GraphQL API endpoint to request your schema from.

  • fieldName - String
    Default: 'craft'
    The URL of a GraphQL API endpoint to request your schema from.

  • typeName - String
    Default: 'craft'
    The prefix to be used for your imported schema's field types.

  • headers - Object
    An object of headers to be passed along with your request to the API endpoint. This will generally be used to authenticate your request.

  • livePreview - Boolean
    Default: false
    Allows switching disabling live preview and query being added on frontend (useful for an environment variable to disable it on production)

Enable Live Preview

Add the CraftLivePreview component to you build.

Override App.vue - See Gridsome docs

  <!-- ... -->
  <CraftLivePreview endpoint="" />
  <!-- ... -->
export default {
  components: {
    CraftLivePreview: () => import ('@bhws/gridsome-source-craft-graphql/CraftLivePreview')

Craft CMS setup

  1. Setup the GraphQL API on Craft

  2. Setup the preview targets

  3. Ensure your preview targets also have ?CraftPreviewSlug={slug} at the end.


npm i @bhws/gridsome-source-craft-graphql

DownloadsWeekly Downloads






Unpacked Size

15 kB

Total Files


Last publish


  • avatar