Configuration
Easily connect your Nuxt.js application to your content hosted on Prismic
You can configure @nuxtjs/prismic
with the prismic
property in your nuxt.config.js
or directly when registering the module in the buildModules
array by using the array syntax.
export default {
prismic: {
/* configuration */
}
}
export default {
buildModules: {
['@nuxtjs/prismic', {
/* configuration */
}]
}
}
Properties
endpoint
- Type:
String
required
The endpoint of your Prismic repository.
prismic: {
// getting content from the Prismic repository named `my-repo`
endpoint: 'https://my-repo.cdn.prismic.io/api/v2'
}
apiOptions
- Type:
Object
- Default:
{}
Options sent to Prismic API when initing the client, see Prismic documentation.
prismic: {
// example querying a private Prismic repository
// please note that the token will bleed in the front-end
apiOptions: {
accessToken: 'yourAccessToken'
}
}
New Routes Resolver
A new routes resolver is being introduced, which replaces the link resolver function with a single JSON declaration. You can take advantage of it by passing a routes
options to the API:
prismic: {
apiOptions: {
// example resolving documents with type `page` to `/:uid`
routes: [
{
type: 'page',
path: '/:uid'
}
]
}
}
Documents coming from the API will then have a new url
property, removing the need to use a link resolver.
Learn more about the new routes resolver here.
preview
- Type:
Boolean|String
- Default:
true
Activate previews on the website, learn more about the preview feature here.
prismic: {
preview: false // disable previews
}
simulator
- Type:
Boolean|String
- Default:
true
Activate the Simulator on the website, learn more about the simulator feature here.
prismic: {
simulator: false // disable the Simulator
}
previewReloadType
- Type:
String
- Default:
'hot'
Configures the preview reload type, learn more about the preview feature here.
prismic: {
previewReloadType: 'hard' // performs hard reloads when reloading the preview
}
components
- Type:
Boolean
- Default:
true
Registers @prismicio/vue components globally.
prismic: {
components: false // disable components global registration
}
linkResolver
- Type:
String(path)|Function
- Default:
~/app/prismic/link-resolver.js
Your link resolver function. By default the module expects you to have it exported at ~/app/prismic/link-resolver.js
, see installation.
prismic: {
// you can provide your link resolver function directly
linkResolver: function(doc) {
return '/'
}
}
htmlSerializer
- Type:
String(path)|Function
- Default:
~/app/prismic/html-serializer.js
Your html serializer function if you need one. By default the module expects you to have it exported at ~/app/prismic/html-serializer.js
.
modern
- 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 oldPrismic.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.
disableGenerator
- Type:
Boolean
- Default:
false
When using the new routes resolver this module is providing a crawler feature that will crawl your Prismic documents and extending Nuxt.js generate.routes
array (see Nuxt.js documentation) with routes to those.
Since version 2.13 Nuxt.js is shipped with a built-in crawler so this module's crawler feature is being deprecated. If you're using Nuxt.js >= 2.13 you should be interested in disabling this module's generator with this option.
prismic: {
disableGenerator: true // disable module's crawler
}
Defaults
Default configuration only expects you to provide your Prismic API endpoint.
export default {
prismic: {
preview: true,
previewReloadType: 'hot',
components: true,
modern: false
}
}