@storyblok/nuxt 6.2.4 → 7.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +0 -46
- package/dist/module.json +1 -1
- package/dist/module.mjs +8 -2
- package/package.json +5 -3
package/README.md
CHANGED
|
@@ -355,52 +355,6 @@ If you want to use the `useStoryblokRichText` composable, you can pass the `reso
|
|
|
355
355
|
</script>
|
|
356
356
|
```
|
|
357
357
|
|
|
358
|
-
### Legacy Rendering Rich Text
|
|
359
|
-
|
|
360
|
-
> [!WARNING]
|
|
361
|
-
> The legacy `richTextResolver` is soon to be deprecated. We recommend migrating to the new approach described above instead.
|
|
362
|
-
|
|
363
|
-
You can easily render rich text by using the `renderRichText` function that comes with `@storyblok/nuxt` and a Vue computed property:
|
|
364
|
-
|
|
365
|
-
```html
|
|
366
|
-
<template>
|
|
367
|
-
<div v-html="articleContent"></div>
|
|
368
|
-
</template>
|
|
369
|
-
|
|
370
|
-
<script setup>
|
|
371
|
-
const props = defineProps({ blok: Object });
|
|
372
|
-
const articleContent = computed(() => renderRichText(props.blok.articleContent));
|
|
373
|
-
</script>
|
|
374
|
-
```
|
|
375
|
-
|
|
376
|
-
You can also set a **custom Schema and component resolver** by passing the options as the second parameter of the `renderRichText` function:
|
|
377
|
-
|
|
378
|
-
```html
|
|
379
|
-
<script setup>
|
|
380
|
-
import cloneDeep from 'clone-deep';
|
|
381
|
-
|
|
382
|
-
const mySchema = cloneDeep(RichTextSchema); // you can make a copy of the default RichTextSchema
|
|
383
|
-
// ... and edit the nodes and marks, or add your own.
|
|
384
|
-
// Check the base RichTextSchema source here https://github.com/storyblok/storyblok-js-client/blob/v4/source/schema.js
|
|
385
|
-
|
|
386
|
-
const props = defineProps({ blok: Object });
|
|
387
|
-
|
|
388
|
-
const articleContent = computed(() =>
|
|
389
|
-
renderRichText(props.blok.articleContent, {
|
|
390
|
-
schema: mySchema,
|
|
391
|
-
resolver: (component, blok) => {
|
|
392
|
-
switch (component) {
|
|
393
|
-
case 'my-custom-component':
|
|
394
|
-
return `<div class="my-component-class">${blok.text}</div>`;
|
|
395
|
-
default:
|
|
396
|
-
return 'Resolver not defined';
|
|
397
|
-
}
|
|
398
|
-
},
|
|
399
|
-
}),
|
|
400
|
-
);
|
|
401
|
-
</script>
|
|
402
|
-
```
|
|
403
|
-
|
|
404
358
|
## 3. Working with preview and/or production environments
|
|
405
359
|
|
|
406
360
|
Remember that the bridge only works using `version: 'draft'` and the _Preview Access Token_.
|
package/dist/module.json
CHANGED
package/dist/module.mjs
CHANGED
|
@@ -39,13 +39,19 @@ const module = defineNuxtModule({
|
|
|
39
39
|
"useStoryblokApi",
|
|
40
40
|
"useStoryblokBridge",
|
|
41
41
|
"renderRichText",
|
|
42
|
-
"RichTextSchema",
|
|
43
42
|
"StoryblokRichText",
|
|
44
43
|
"useStoryblokRichText",
|
|
45
44
|
"MarkTypes",
|
|
46
45
|
"BlockTypes",
|
|
47
46
|
"LinkTypes",
|
|
48
|
-
"AssetTypes"
|
|
47
|
+
"AssetTypes",
|
|
48
|
+
"StoryblokRichTextResolvers",
|
|
49
|
+
"StoryblokRichTextDocumentNode",
|
|
50
|
+
"StoryblokRichTextImageOptimizationOptions",
|
|
51
|
+
"StoryblokRichTextNode",
|
|
52
|
+
"StoryblokRichTextNodeResolver",
|
|
53
|
+
"StoryblokRichTextNodeTypes",
|
|
54
|
+
"StoryblokRichTextOptions"
|
|
49
55
|
];
|
|
50
56
|
for (const name of names) {
|
|
51
57
|
addImports({ name, as: name, from: "@storyblok/vue" });
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@storyblok/nuxt",
|
|
3
3
|
"type": "module",
|
|
4
|
-
"version": "
|
|
4
|
+
"version": "7.0.1",
|
|
5
5
|
"packageManager": "pnpm@10.2.0",
|
|
6
6
|
"description": "Storyblok Nuxt module",
|
|
7
7
|
"repository": {
|
|
@@ -38,10 +38,11 @@
|
|
|
38
38
|
"pretest:e2e-static": "nuxi generate playground",
|
|
39
39
|
"test:e2e-static": "start-server-and-test dev:preview http://localhost:3000 cy:run",
|
|
40
40
|
"lint": "eslint .",
|
|
41
|
-
"lint:fix": "eslint . --fix"
|
|
41
|
+
"lint:fix": "eslint . --fix",
|
|
42
|
+
"check-licenses": "node scripts/license-checker.mjs"
|
|
42
43
|
},
|
|
43
44
|
"dependencies": {
|
|
44
|
-
"@storyblok/vue": "^
|
|
45
|
+
"@storyblok/vue": "^9.0.0"
|
|
45
46
|
},
|
|
46
47
|
"devDependencies": {
|
|
47
48
|
"@commitlint/cli": "^19.7.1",
|
|
@@ -61,6 +62,7 @@
|
|
|
61
62
|
"eslint-config-prettier": "^9.1.0",
|
|
62
63
|
"eslint-plugin-cypress": "^3.5.0",
|
|
63
64
|
"eslint-plugin-vue": "^9.28.0",
|
|
65
|
+
"license-checker": "^25.0.1",
|
|
64
66
|
"nuxt": "^3.15.4",
|
|
65
67
|
"prettier": "^3.4.2",
|
|
66
68
|
"simple-git-hooks": "^2.11.1",
|