title | description | icon |
---|---|---|
Advanced |
Nuxt Content is highly customizable, giving you freedom and control over how the data is transformed. |
heroicons-outline:lightning-bolt |
The module adds some hooks you can use:
::alert
In order to use content:file:*
hooks you need to create custom nitro plugin.
::
Allows you to modify the contents of a file before it is handled by the parsers.
Arguments:
- file
- Type:
Object
- Properties:
- _id:
String
- body:
String
- _id:
- Type:
Changing all occurrences of react to vue in all Markdown files:
export default defineNitroPlugin((nitroApp) => {
nitroApp.hooks.hook('content:file:beforeParse', (file) => {
if (file._id.endsWith('.md')) {
file.body = file.body.replace(/react/g, 'vue')
}
})
})
Allows you to modify a document after being parsed by parsers.
Using content's first picture as cover image.
import { visit } from 'unist-util-visit'
export default defineNitroPlugin((nitroApp) => {
nitroApp.hooks.hook('content:file:afterParse', (file) => {
if (file._id.endsWith('.md')) {
visit(file.body, (n:any) => n.tag === 'img', (node) => {
file.coverImage = node.props.src
})
}
})
})