First prototype.

.editorconfig

@@ -0,0 +1,13 @@
+# editorconfig.org
+root = true
+
+[*]
+indent_size = 2
+indent_style = space
+end_of_line = lf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true
+
+[*.md]
+trim_trailing_whitespace = false

.eslintignore

@@ -0,0 +1,8 @@
+# Common
+node_modules
+dist
+.nuxt
+coverage
+
+# Plugin
+lib/plugin.js

.eslintrc.js

@@ -0,0 +1,10 @@
+module.exports = {
+  root: true,
+  parserOptions: {
+    parser: 'babel-eslint',
+    sourceType: 'module'
+  },
+  extends: [
+    '@nuxtjs'
+  ]
+}

.github/workflows/ci.yml

@@ -0,0 +1,45 @@
+name: ci
+
+on:
+  push:
+    branches:
+      - master
+  pull_request:
+    branches:
+      - master
+
+jobs:
+  ci:
+    runs-on: ${{ matrix.os }}
+
+    strategy:
+      matrix:
+        os: [ubuntu-latest, macos-latest, windows-latest]
+        node: [10, 12]
+
+    steps:
+      - uses: actions/setup-node@v1
+        with:
+          node-version: ${{ matrix.node }}
+
+      - name: checkout
+        uses: actions/checkout@master
+
+      - name: cache node_modules
+        uses: actions/cache@v1
+        with:
+          path: node_modules
+          key: ${{ matrix.os }}-node-v${{ matrix.node }}-deps-${{ hashFiles(format('{0}{1}', github.workspace, '/yarn.lock')) }}
+
+      - name: Install dependencies
+        if: steps.cache.outputs.cache-hit != 'true'
+        run: yarn
+
+      - name: Lint
+        run: yarn lint
+
+      - name: Test
+        run: yarn test
+
+      - name: Coverage
+        uses: codecov/codecov-action@v1

.gitignore

@@ -0,0 +1,9 @@
+node_modules
+*.iml
+.idea
+*.log*
+.nuxt
+.vscode
+.DS_Store
+coverage
+dist

LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) Wolfgang Ziegler // fago <[email protected]>
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

README.md

@@ -0,0 +1,61 @@
+# @nuxtjs/drupal-ce
+
+[![npm version][npm-version-src]][npm-version-href]
+[![npm downloads][npm-downloads-src]][npm-downloads-href]
+[![Github Actions CI][github-actions-ci-src]][github-actions-ci-href]
+[![Codecov][codecov-src]][codecov-href]
+[![License][license-src]][license-href]
+
+> Easily connect Nuxt.js to Drupal via custom elements.
+
+[📖 **Release Notes**](./CHANGELOG.md)
+
+## Setup
+
+1. Add `@nuxtjs/drupal-ce` dependency to your project
+
+```bash
+yarn add @nuxtjs/drupal-ce # or npm install @nuxtjs/drupal-ce
+```
+
+2. Add `@nuxtjs/drupal-ce` to the `modules` section of `nuxt.config.js`
+
+```js
+{
+  modules: [
+    // Simple usage
+    '@nuxtjs/drupal-ce',
+
+    // With options
+    ['@nuxtjs/drupal-ce', { /* module options */ }]
+  ]
+}
+```
+
+## Development
+
+1. Clone this repository
+2. Install dependencies using `yarn install` or `npm install`
+3. Start development server using `npm run dev`
+
+## License
+
+[MIT License](./LICENSE)
+
+Copyright (c) Wolfgang Ziegler // fago <[email protected]>
+
+<!-- Badges -->
+[npm-version-src]: https://img.shields.io/npm/v/@nuxtjs/drupal-ce/latest.svg
+[npm-version-href]: https://npmjs.com/package/@nuxtjs/drupal-ce
+
+[npm-downloads-src]: https://img.shields.io/npm/dt/@nuxtjs/drupal-ce.svg
+[npm-downloads-href]: https://npmjs.com/package/@nuxtjs/drupal-ce
+
+[github-actions-ci-src]: https://github.com/drunomics/nuxt-drupal-ce/workflows/ci/badge.svg
+[github-actions-ci-href]: https://github.com/drunomics/nuxt-drupal-ce/actions?query=workflow%3Aci
+
+[codecov-src]: https://img.shields.io/codecov/c/github/drunomics/nuxt-drupal-ce.svg
+[codecov-href]: https://codecov.io/gh/drunomics/nuxt-drupal-ce
+
+[license-src]: https://img.shields.io/npm/l/@nuxtjs/drupal-ce.svg
+[license-href]: https://npmjs.com/package/@nuxtjs/drupal-ce

babel.config.js

@@ -0,0 +1,11 @@
+module.exports = {
+  presets: [
+    [
+      '@babel/preset-env', {
+        targets: {
+          esmodules: true
+        }
+      }
+    ]
+  ]
+}

commitlint.config.js

@@ -0,0 +1,5 @@
+module.exports = {
+  extends: [
+    '@commitlint/config-conventional'
+  ]
+}

example/nuxt.config.js

@@ -0,0 +1,10 @@
+const { resolve } = require('path')
+
+module.exports = {
+  rootDir: resolve(__dirname, '..'),
+  buildDir: resolve(__dirname, '.nuxt'),
+  srcDir: __dirname,
+  modules: [
+    { handler: require('../') }
+  ]
+}

example/pages/index.vue

@@ -0,0 +1,11 @@
+<template>
+  <div>
+    Works!
+  </div>
+</template>
+
+<script>
+export default {
+
+}
+</script>

husky.config.js

@@ -0,0 +1,7 @@
+module.exports = {
+  hooks: {
+    'commit-msg': 'commitlint -E HUSKY_GIT_PARAMS',
+    'pre-commit': 'yarn lint',
+    'pre-push': 'yarn lint'
+  }
+}

jest.config.js

@@ -0,0 +1,17 @@
+module.exports = {
+  testEnvironment: 'node',
+  collectCoverage: true,
+  collectCoverageFrom: [
+    'lib/**/*.js',
+    '!lib/plugin.js'
+  ],
+  moduleNameMapper: {
+    '^~/(.*)$': '<rootDir>/lib/$1',
+    '^~~$': '<rootDir>',
+    '^@@$': '<rootDir>',
+    '^@/(.*)$': '<rootDir>/lib/$1'
+  },
+  transform: {
+    '^.+\\.js$': 'babel-jest'
+  }
+}

lib/module.js

@@ -0,0 +1,34 @@
+const { resolve } = require('path')
+import chalk from 'chalk'
+
+module.exports = async function (moduleOptions) {
+
+  const defaultOptions = {
+    baseURL: process.env.DRUPAL_BASE_URL || 'http://localhost:8123',
+    requestFormat: 'custom_elements',
+    requestContentFormat: 'markup',
+    axios: {}
+  }
+
+  const options = {
+    ...this.options['@nuxtjs/drupal-ce'],
+    ...moduleOptions,
+    ...defaultOptions
+  }
+
+  const { nuxt } = this
+  nuxt.options.cli.badgeMessages.push(`Drupal URL: ${chalk.underline.blue(options.baseURL)}`)
+
+  this.options.publicRuntimeConfig = this.options.publicRuntimeConfig || {}
+  this.options.publicRuntimeConfig['drupal-ce'] = this.options.publicRuntimeConfig['drupal-ce'] || {}
+  this.options.publicRuntimeConfig['drupal-ce'].baseURL = options.baseURL
+
+  this.addPlugin({
+    src: resolve(__dirname, 'plugin.js'),
+    options
+  })
+
+  await this.requireModule('@nuxtjs/axios')
+}
+
+module.exports.meta = require('../package.json')

lib/plugin.js

@@ -0,0 +1,84 @@
+import Vue from 'vue'
+
+class DrupalCe {
+
+  constructor(axios, context, options) {
+    this.options = options;
+    this.context = context
+
+    /**
+     * The axios instance for communicating with Drupal.
+     */
+    this.$axios = axios
+
+    /**
+     * The data of the current Page (reactive).
+     */
+    this.$currentPage = Vue.observable({
+      title: null,
+      metadata: [],
+      content: 'No content loaded.',
+      breadcrumbs: [],
+      messages: [],
+      localTasks: null,
+      settings: {},
+    })
+
+    /**
+     * Returns an object for rendering as Vue component.
+     */
+    this.$currentPage.contentComponent = () => {
+      return { name: 'DrupalContent', template: this.$currentPage.content }
+    }
+  }
+
+  /**
+   * Fetches a new page.
+   *
+   * @param url
+   *   The url of the page to fetch, relative to the configured base url.
+   *
+   * @returns {Promise<void>}
+   */
+  async fetchPage(url) {
+    await this.$axios
+      .get(url)
+      .then(({ data }) => {
+        if (!data.title || !data.content) {
+          return this.context.error({ statusCode: 422, message: 'Malformed API response. Please make sure to install Custom Elements renderer: https://www.drupal.org/project/lupus_ce_renderer'})
+        }
+        this.$currentPage.title = data.title
+        this.$currentPage.metadata = data.metadata
+        this.$currentPage.content = data.content
+        this.$currentPage.breadcrumbs = data.breadcrumbs
+        this.$currentPage.messages = data.messages
+        this.$currentPage.localTasks = data.localTasks
+        this.$currentPage.settings = data.settings
+        return this.$currentPage
+      })
+      .catch((err) => {
+        this.context.error(err)
+        return err
+      })
+  }
+}
+
+export default async function (context, inject) {
+  const { $config, $axios } = context
+
+  const runtimeConfig = $config['drupal-ce'] || {}
+  const options = JSON.parse(`<%= JSON.stringify(options) %>`)
+  options.baseURL = runtimeConfig.baseURL || options.baseURL
+
+  if (!$axios) {
+    console.error('Error: Axios not found. Remove nuxtjs/axios from your Nuxt modules or make sure it\'s listed before @nuxtjs/drupal-ce.')
+    return
+  }
+
+  // Create a custom axios instance, optionally having custom options.
+  const $axiosDrupal = $axios.create(options.axios)
+  $axiosDrupal.setBaseURL(options.baseURL)
+
+  const drupal = new DrupalCe($axiosDrupal, context, options)
+  inject('drupal', drupal)
+}