nuxt-og-image 2.0.0-beta.33 → 2.0.0-beta.35
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 +34 -20
- package/dist/module.d.ts +1 -1
- package/dist/module.json +1 -1
- package/dist/module.mjs +9 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -52,26 +52,28 @@ Both Satori and Browser will work in Node based environments. Prerendering is fu
|
|
|
52
52
|
|
|
53
53
|
When you want to generate dynamic images at runtime there are certain Nitro runtime limitations.
|
|
54
54
|
|
|
55
|
-
| Provider
|
|
56
|
-
|
|
57
|
-
|
|
|
58
|
-
|
|
|
59
|
-
| Vercel
|
|
60
|
-
|
|
|
61
|
-
| Cloudflare
|
|
62
|
-
|
|
|
63
|
-
| Netlify
|
|
64
|
-
|
|
|
65
|
-
|
|
66
|
-
Other providers are yet to be tested. Please create an issue if
|
|
55
|
+
| Provider | Satori | Browser |
|
|
56
|
+
|---------------------------------------------------------------------------------|--------|---------|
|
|
57
|
+
| Node | ✅ | ✅ |
|
|
58
|
+
| [Vercel](https://nuxt-og-image-playground.vercel.app/) | ✅ | Soon |
|
|
59
|
+
| [Vercel Edge](https://nuxt-og-image-playground-gkdt.vercel.app/) | ✅ | ❌ |
|
|
60
|
+
| Cloudflare Workers (requires paid) | ✅ | ❌ |
|
|
61
|
+
| [Cloudflare Pages](https://nuxt-og-image-playground.pages.dev/) | ✅ | ❌ |
|
|
62
|
+
| [Netlify](https://nuxt-og-image-playground-netlify.netlify.app/) | Soon | ❌ |
|
|
63
|
+
| [Netlify Edge](https://nuxt-og-image-playground-netlify-edge.netlify.app/) | Soon | ❌ |
|
|
64
|
+
| [StackBlitz](https://stackblitz.com/edit/nuxt-starter-pxs3wk?file=package.json) | ✅ | ❌ |
|
|
65
|
+
|
|
66
|
+
Other providers are yet to be tested. Please create an issue if your nitro preset is not listed.
|
|
67
67
|
|
|
68
68
|
## Install
|
|
69
69
|
|
|
70
|
+
Note: The `main` branch is documentation for the beta version, it's recommended to use this version.
|
|
71
|
+
|
|
70
72
|
```bash
|
|
71
73
|
# Install module
|
|
72
|
-
npm install --save-dev nuxt-og-image
|
|
74
|
+
npm install --save-dev nuxt-og-image@beta
|
|
73
75
|
# Using yarn
|
|
74
|
-
yarn add --dev nuxt-og-image
|
|
76
|
+
yarn add --dev nuxt-og-image@beta
|
|
75
77
|
```
|
|
76
78
|
|
|
77
79
|
## Setup
|
|
@@ -414,12 +416,14 @@ Make sure to set the font family in your component to match the font name.
|
|
|
414
416
|
</template>
|
|
415
417
|
```
|
|
416
418
|
|
|
417
|
-
## Caching
|
|
419
|
+
## Runtime Caching
|
|
420
|
+
|
|
421
|
+
When images are generated at runtime, caching is enabled by default to reduce the load on your server.
|
|
418
422
|
|
|
419
|
-
|
|
420
|
-
by providing a `runtimeCacheStorage` option to the `ogImage` config.
|
|
423
|
+
By default, it will use the default storage engine for your Nitro preset.
|
|
424
|
+
You can customise the storage engine by providing a `runtimeCacheStorage` option to the `ogImage` config.
|
|
421
425
|
|
|
422
|
-
|
|
426
|
+
The option takes the same configuration as the Nuxt `nitro.storage` option.
|
|
423
427
|
See the [Nitro Storage Layer](https://nitro.unjs.io/guide/storage) documentation for more details.
|
|
424
428
|
|
|
425
429
|
For example:
|
|
@@ -436,7 +440,7 @@ export default defineNuxtConfig({
|
|
|
436
440
|
})
|
|
437
441
|
````
|
|
438
442
|
|
|
439
|
-
By default, images will be cached for 24 hours. You can change the image TTL by providing `cacheTtl` when defining the image.
|
|
443
|
+
By default, static images will be cached for 24 hours. You can change the image TTL by providing `cacheTtl` when defining the image.
|
|
440
444
|
|
|
441
445
|
```ts
|
|
442
446
|
defineOgImageStatic({
|
|
@@ -466,8 +470,18 @@ defineOgImageStatic({
|
|
|
466
470
|
cacheKey: `${myData.id}:${myData.updatedAt}`,
|
|
467
471
|
})
|
|
468
472
|
</script>
|
|
469
|
-
|
|
473
|
+
```
|
|
474
|
+
|
|
475
|
+
If you prefer not to cache your images you can always disable them by providing a `false` value.
|
|
470
476
|
|
|
477
|
+
```ts
|
|
478
|
+
export default defineNuxtConfig({
|
|
479
|
+
ogImage: {
|
|
480
|
+
// no runtime cache
|
|
481
|
+
runtimeCacheStorage: false
|
|
482
|
+
}
|
|
483
|
+
})
|
|
484
|
+
````
|
|
471
485
|
|
|
472
486
|
# API
|
|
473
487
|
|
package/dist/module.d.ts
CHANGED
package/dist/module.json
CHANGED
package/dist/module.mjs
CHANGED
|
@@ -247,6 +247,12 @@ const RuntimeCompatibility = {
|
|
|
247
247
|
browser: "lambda",
|
|
248
248
|
wasm: "inline"
|
|
249
249
|
},
|
|
250
|
+
"netlify-edge": {
|
|
251
|
+
wasm: "inline"
|
|
252
|
+
},
|
|
253
|
+
"vercel": {
|
|
254
|
+
browser: "lambda"
|
|
255
|
+
},
|
|
250
256
|
"cloudflare-pages": {
|
|
251
257
|
browser: false,
|
|
252
258
|
wasm: "import"
|
|
@@ -315,8 +321,10 @@ const module = defineNuxtModule({
|
|
|
315
321
|
},
|
|
316
322
|
async setup(config, nuxt) {
|
|
317
323
|
const logger = useLogger("nuxt-og-image");
|
|
324
|
+
logger.level = config.debug ? 4 : 3;
|
|
318
325
|
const { resolve } = createResolver(import.meta.url);
|
|
319
326
|
const nitroCompatibility = getNitroProviderCompatibility(nuxt);
|
|
327
|
+
logger.debug("Nitro compatibility:", nitroCompatibility);
|
|
320
328
|
if (!nitroCompatibility) {
|
|
321
329
|
const target = process.env.NITRO_PRESET || nuxt.options.nitro.preset;
|
|
322
330
|
logger.warn(`It looks like the nitro target ${target} doesn't support \`nuxt-og-image\`.`);
|
|
@@ -338,7 +346,7 @@ const module = defineNuxtModule({
|
|
|
338
346
|
nuxt.options.nitro.storage["og-image"] = {
|
|
339
347
|
driver: "memory"
|
|
340
348
|
};
|
|
341
|
-
} else if (config.runtimeCacheStorage && !nuxt.options.dev) {
|
|
349
|
+
} else if (config.runtimeCacheStorage && !nuxt.options.dev && typeof config.runtimeCacheStorage === "object") {
|
|
342
350
|
nuxt.options.nitro.storage["og-image"] = config.runtimeCacheStorage;
|
|
343
351
|
}
|
|
344
352
|
if (!config.fonts.length)
|