diff --git a/packages/views/package.json b/packages/views/package.json index fa64e190a..ecb47bf3a 100644 --- a/packages/views/package.json +++ b/packages/views/package.json @@ -32,15 +32,18 @@ "require": "./dist/druxt-views.ssr.js", "import": "./dist/druxt-views.esm.js" }, - "./components/*": "./dist/components/*" + "./components/*": "./dist/components/*", + "./nuxt": "./nuxt/index.js" }, "main": "dist/druxt-views.ssr.js", "module": "dist/druxt-views.esm.js", "files": [ "dist", + "nuxt", "templates" ], "dependencies": { + "@nuxt/kit": "^3.12.2", "axios": "0.27.2", "deepmerge": "^4.3.1", "drupal-jsonapi-params": "^2.2.0", diff --git a/packages/views/src/index.js b/packages/views/src/index.js index 71e2300b3..273a9138a 100644 --- a/packages/views/src/index.js +++ b/packages/views/src/index.js @@ -1,18 +1,3 @@ -import { DruxtViewsNuxtModule } from './nuxt' -DruxtViewsNuxtModule.meta = require('../package.json') - -/** - * The Nuxt.js module function. - * - * Installs the module functionality in a Nuxt application. - * - * @type {Function} - * @exports default - * @name DruxtViewsNuxtModule - * @see {@link ./nuxt|DruxtViewsNuxtModule} - */ -export default DruxtViewsNuxtModule - /** * Vuex store module. * diff --git a/packages/views/src/nuxt/index.js b/packages/views/src/nuxt/index.js index 477ab2cf8..c4725c4fe 100644 --- a/packages/views/src/nuxt/index.js +++ b/packages/views/src/nuxt/index.js @@ -1,5 +1,6 @@ +import { addPluginTemplate, defineNuxtModule, installModule } from '@nuxt/kit' import { join, resolve } from 'path' -import DruxtViewsStorybook from './storybook' +// import DruxtViewsStorybook from './storybook' /** * The Nuxt.js module function. @@ -23,45 +24,56 @@ import DruxtViewsStorybook from './storybook' * * @param {object} moduleOptions - Nuxt module options object. */ -const DruxtViewsNuxtModule = async function (moduleOptions = {}) { - // Set default options. - const options = { - baseUrl: moduleOptions.baseUrl, - ...(this.options || {}).druxt || {}, - views: { - query: {}, - ...((this.options || {}).druxt || {}).views, - ...moduleOptions, +const DruxtViewsNuxtModule = defineNuxtModule({ + meta: { + name: 'druxt-views', + }, + defaults: { + baseUrl: '', + endpoint: '/jsonapi' + }, + + async setup(moduleOptions, nuxt) { + // Set default options. + const options = { + baseUrl: moduleOptions.baseUrl, + ...nuxt.options?.druxt || {}, + views: { + query: {}, + ...nuxt.options?.druxt?.views, + ...moduleOptions, + } } - } - // Register components directories. - this.nuxt.hook('components:dirs', dirs => { - dirs.push({ path: join(__dirname, 'components') }) - dirs.push({ path: join(__dirname, 'components/blocks') }) - }) + // Register components directories. + nuxt.hook('components:dirs', dirs => { + dirs.push({ path: join(__dirname, '../dist/components') }) + dirs.push({ path: join(__dirname, '../dist/components/blocks') }) + }) - // Add dependant modules. - await this.addModule(['druxt', options]) - const modules = ['druxt-entity', 'druxt-schema'] - for (const module of modules) { - await this.addModule([module, { baseUrl: options.baseUrl }]) - } + // Add dependant modules. + await installModule('druxt/nuxt', options, nuxt) + const modules = ['druxt-entity', 'druxt-schema'] + for (const module of modules) { + await installModule(module, { baseUrl: options.baseUrl }, nuxt) + } - // Add Vuex plugin. - this.addPlugin({ - src: resolve(__dirname, '../templates/store.js'), - fileName: 'store/druxt-views.js', - options: options.druxt - }) + // Add Vuex plugin. + addPluginTemplate({ + src: resolve(__dirname, '../templates/store.js'), + fileName: 'store/druxt-views.js', + options: options.druxt + }) - // Enable Vuex Store. - options.store = true + // Enable Vuex Store. + nuxt.options.store = true + } // Nuxt Storybook. - this.nuxt.hook('storybook:config', async ({ stories }) => { - await DruxtViewsStorybook.call(this, { stories }) - }) -} + // @TODO - @nuxt/kit and @nuxt/storybook aren't compatible. + // this.nuxt.hook('storybook:config', async ({ stories }) => { + // await DruxtViewsStorybook.call(this, { stories }) + // }) +}) -export { DruxtViewsNuxtModule } +export default DruxtViewsNuxtModule