feat: add modern option, fixes #134

Author: lihbr

README.md

@@ -36,7 +36,8 @@ yarn add @nuxtjs/prismic # or npm install @nuxtjs/prismic
     '@nuxtjs/prismic',
   ],
   prismic: {
-    endpoint: 'https://<REPOSITORY>.cdn.prismic.io/api/v2'
+    endpoint: 'https://<REPOSITORY>.cdn.prismic.io/api/v2',
+    modern: true
     // see documentation for more!
   }
 }

docs/content/en/1.index.md

@@ -2,7 +2,7 @@
 title: Introduction
 description: 'Easily connect your Nuxt.js application to your content hosted on Prismic'
 category: 'Getting Started'
-version: 1.3
+version: 1.2
 fullscreen: false
 menu: true
 menuTitle: Introduction

docs/content/en/2.installation.md

@@ -37,12 +37,19 @@ Then, add `@nuxtjs/prismic` to the `buildModules` section of `nuxt.config.js` an
     '@nuxtjs/prismic'
   ],
   prismic: {
-    endpoint: 'https://<REPOSITORY>.cdn.prismic.io/api/v2'
+    endpoint: 'https://<REPOSITORY>.cdn.prismic.io/api/v2',
+    modern: true
     /* see configuration for more */
   }
 }
 ```
 
+
+> The `modern` option allows the module to use future-proof features. If you're new to the module you should leave it on and not worry about it.
+>
+> More on the `modern` option in the [configuration section](./configuration#modern).
+
+
 Finally, you're expected to provide a link resolver function at `~/app/prismic/link-resolver.js`:
 
 ```javascript[link-resolver.js]

docs/content/en/3.injected-kits.md

@@ -2,7 +2,7 @@
 title: Injected Kits
 description: 'Easily connect your Nuxt.js application to your content hosted on Prismic'
 category: 'Getting Started'
-version: 1.3
+version: 1.2
 fullscreen: false
 menu: true
 menuTitle: Injected Kits

docs/content/en/6.configuration.md

@@ -2,7 +2,7 @@
 title: Configuration
 description: 'Easily connect your Nuxt.js application to your content hosted on Prismic'
 category: 'Module API Reference'
-version: 1.2
+version: 1.3
 fullscreen: false
 menu: true
 menuTitle: Configuration
@@ -153,6 +153,19 @@ prismic: {
 
 Your [html serializer](https://prismic.io/docs/technologies/html-serializer-nuxtjs) function if you need one. By default the module expects you to have it exported at `~/app/prismic/html-serializer.js`.
 
+
+### modern
+<d-badge>v1.3+</d-badge>
+
+- Type `Boolean`
+- Default: `false`
+
+This option allows the module to use future-proof features. When set to `true` it:
+
+- Turns off deprecated features unless explicitly enabled (this only impact `disabledGenerator` below, automatically disabling it);
+- Tells the module to use the more recent `Prismic.client` method instead of the old `Prismic.api` one when initing the API. This allows the API to lazily init itself once in production, saving your website from useless calls. Although this comes with some minor breaking changes (that won't impact you 99% of the time), [see #134 for more information](https://github.com/nuxt-community/prismic-module/issues/134).
+
+
 ### disableGenerator
 <d-badge>Deprecated</d-badge>
 
@@ -177,7 +190,8 @@ Default configuration only expects you to provide [your Prismic API endpoint](#e
 export default {
   prismic: {
     preview: true,
-    components: true
+    components: true,
+    modern: false
   }
 }
 ```

example/nuxt.config.js

@@ -3,6 +3,7 @@ export default {
     '../src/module.js'
   ],
   prismic: {
-    endpoint: 'https://200629-sms-hoy.cdn.prismic.io/api/v2'
+    endpoint: 'https://200629-sms-hoy.cdn.prismic.io/api/v2',
+    modern: true
   }
 }

example/pages/index.vue

@@ -14,6 +14,9 @@ export default {
     } else {
       error({ statusCode: 404, message: 'Page not found' })
     }
+  },
+  mounted () {
+    console.log(this.$prismic.api)
   }
 }
 </script>

src/module.js

@@ -7,12 +7,16 @@ function install (moduleOptions) {
   const options = {
     preview: true,
     components: true,
+    modern: false,
     ...moduleOptions,
     ...(this.options.prismic || {})
   }
   if (options.preview === true) {
     options.preview = '/preview'
   }
+  if (options.modern === true && typeof options.disableGenerator === 'undefined') {
+    options.disableGenerator = true
+  }
   if (!options.endpoint) {
     logger.warn('Options `endpoint` is required, disabling module...')
     return
@@ -72,6 +76,7 @@ function install (moduleOptions) {
     options: {
       preview: options.preview,
       endpoint: options.endpoint,
+      modern: options.modern,
       apiOptions,
       repo,
       script: `//static.cdn.prismic.io/prismic.min.js?repo=${repo}&new=true`

templates/plugins/prismic.js

@@ -16,7 +16,11 @@ export default async (context, inject) => {
 
   let api = {}
   try {
+    <% if (options.modern) { %>
+    api = Prismic.client('<%= options.endpoint %>', Object.assign({}, options,  <%= JSON.stringify(options.apiOptions) %>))
+    <% } else { %>
     api = await Prismic.api('<%= options.endpoint %>', Object.assign({}, options,  <%= JSON.stringify(options.apiOptions) %>))
+    <% } %>
   } catch (error) {
     console.error(error)
     console.error("Failed to init Prismic API, preventing app fatal error.")

test/index.test.js

@@ -167,4 +167,17 @@ describe('prismic-nuxt module', () => {
     prismicNuxt.call(context, moduleOptions)
     expect(context.nuxt.hook).not.toBeCalledWith('generate:before', expect.anything())
   })
+
+  it('should not run generate if only modern is set', () => {
+    moduleOptions.modern = true
+    prismicNuxt.call(context, moduleOptions)
+    expect(context.nuxt.hook).not.toBeCalledWith('generate:before', expect.anything())
+  })
+
+  it('should run generate if modern is set and generator is explicitely not disabled', () => {
+    moduleOptions.modern = true
+    moduleOptions.disableGenerator = false
+    prismicNuxt.call(context, moduleOptions)
+    expect(context.nuxt.hook).toBeCalledWith('generate:before', expect.anything())
+  })
 })