Setup

The Drupal Custom Elements Connector makes it easy to connect Nuxt with Lupus Decoupled Drupal and provide scaffold components to get started.

Steps

1. Add the nuxt module nuxtjs-drupal-ce to your Nuxt project:

npx nuxi@latest module add drupal-ce

2. Configure the module in your nuxt config file nuxt.config.js

export default defineNuxtConfig({
  modules: [
    'nuxtjs-drupal-ce',
  ],
  drupalCe: {
    drupalBaseUrl: 'https://your-drupal.example.com',
    // more options...
  }
})

The module defaults work well with Lupus Decoupled Drupal, so setting the drupalBaseUrl is usually enough. Howsoever, a complete list of options can be found in the module README.

3. The module provides a set of scaffold files to get started quickly.

To generate the scaffold pages and components, run:

rm -f app.vue && npx nuxt-drupal-ce-init

The full list of scaffolded files is available in the nuxtjs-drupal-ce repository.