nuxt-og-image 0.5.0 → 0.5.3
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/dist/module.d.ts +2 -2
- package/dist/module.json +1 -1
- package/dist/module.mjs +12 -27
- package/dist/runtime/{browserService.d.ts → browserUtil.d.ts} +0 -1
- package/dist/runtime/browserUtil.mjs +22 -0
- package/dist/runtime/browsers/default.d.ts +1 -0
- package/dist/runtime/browsers/default.mjs +19 -0
- package/dist/runtime/browsers/lambda.d.ts +1 -0
- package/dist/runtime/browsers/lambda.mjs +9 -0
- package/dist/runtime/nitro/image.d.ts +1 -1
- package/dist/runtime/nitro/image.mjs +5 -2
- package/package.json +2 -2
- package/dist/runtime/browserService.mjs +0 -64
package/dist/module.d.ts
CHANGED
|
@@ -36,9 +36,9 @@ interface ModuleOptions extends ScreenshotOptions {
|
|
|
36
36
|
*/
|
|
37
37
|
host: string;
|
|
38
38
|
/**
|
|
39
|
-
*
|
|
39
|
+
* Are we edge-side rendering images.
|
|
40
40
|
*/
|
|
41
|
-
|
|
41
|
+
edgeSideRender: boolean;
|
|
42
42
|
}
|
|
43
43
|
declare const _default: _nuxt_schema.NuxtModule<ModuleOptions>;
|
|
44
44
|
|
package/dist/module.json
CHANGED
package/dist/module.mjs
CHANGED
|
@@ -9,34 +9,16 @@ import { withBase, joinURL } from 'ufo';
|
|
|
9
9
|
import fg from 'fast-glob';
|
|
10
10
|
import { join } from 'pathe';
|
|
11
11
|
|
|
12
|
-
const debugBinaryUsage = (s, error) => {
|
|
13
|
-
if (!process.dev) {
|
|
14
|
-
console.log(s, error);
|
|
15
|
-
}
|
|
16
|
-
};
|
|
17
12
|
async function createBrowser() {
|
|
18
13
|
try {
|
|
19
|
-
const playwrightCore = await import(
|
|
20
|
-
|
|
21
|
-
const awsChrome = await import(String("chrome-aws-lambda"));
|
|
22
|
-
return await playwrightCore.chromium.launch({
|
|
23
|
-
args: awsChrome.args,
|
|
24
|
-
executablePath: await awsChrome.executablePath,
|
|
25
|
-
headless: awsChrome.headless
|
|
26
|
-
});
|
|
27
|
-
} catch (e) {
|
|
28
|
-
debugBinaryUsage("[nuxt-og-image] Skipping chrome-aws-lambda", e);
|
|
29
|
-
}
|
|
30
|
-
try {
|
|
31
|
-
const playwrightCore = await import('playwright-core');
|
|
32
|
-
const { Launcher } = await import('chrome-launcher');
|
|
14
|
+
const playwrightCore = await import(String("playwright-core"));
|
|
15
|
+
const { Launcher } = await import(String("chrome-launcher"));
|
|
33
16
|
const chromePath = Launcher.getFirstInstallation();
|
|
34
17
|
return await playwrightCore.chromium.launch({
|
|
35
18
|
headless: true,
|
|
36
19
|
executablePath: chromePath
|
|
37
20
|
});
|
|
38
21
|
} catch (e) {
|
|
39
|
-
debugBinaryUsage("[nuxt-og-image] Skipping chrome-launcher", e);
|
|
40
22
|
}
|
|
41
23
|
try {
|
|
42
24
|
const playwright = await import(String("playwright"));
|
|
@@ -44,13 +26,9 @@ async function createBrowser() {
|
|
|
44
26
|
headless: true
|
|
45
27
|
});
|
|
46
28
|
} catch (e) {
|
|
47
|
-
if (!process.dev)
|
|
48
|
-
debugBinaryUsage("[nuxt-og-image] Playwright failed", e);
|
|
49
|
-
throw new Error(`
|
|
50
|
-
Missing chromium binary. Please run "npx playwright install".
|
|
51
|
-
`);
|
|
52
29
|
}
|
|
53
30
|
}
|
|
31
|
+
|
|
54
32
|
async function screenshot(browser, url, options) {
|
|
55
33
|
const page = await browser.newPage({
|
|
56
34
|
colorScheme: options.colorScheme
|
|
@@ -103,12 +81,13 @@ const module = defineNuxtModule({
|
|
|
103
81
|
height: 630,
|
|
104
82
|
defaultIslandComponent: "OgImageTemplate",
|
|
105
83
|
outputDir: "_og-images",
|
|
106
|
-
|
|
84
|
+
edgeSideRender: nuxt.options.dev || (process.env.NITRO_PRESET || "").includes("edge")
|
|
107
85
|
};
|
|
108
86
|
},
|
|
109
87
|
async setup(config, nuxt) {
|
|
110
88
|
const { resolve } = createResolver(import.meta.url);
|
|
111
89
|
nuxt.options.experimental.componentIslands = true;
|
|
90
|
+
const isEdge = (process.env.NITRO_PRESET || "").includes("edge");
|
|
112
91
|
addTemplate({
|
|
113
92
|
filename: "nuxt-og-image.d.ts",
|
|
114
93
|
getContents: () => {
|
|
@@ -128,7 +107,7 @@ declare module 'nitropack' {
|
|
|
128
107
|
addServerHandler({
|
|
129
108
|
handler: resolve("./runtime/nitro/html")
|
|
130
109
|
});
|
|
131
|
-
if (config.
|
|
110
|
+
if (config.edgeSideRender) {
|
|
132
111
|
addServerHandler({
|
|
133
112
|
handler: resolve("./runtime/nitro/image")
|
|
134
113
|
});
|
|
@@ -166,6 +145,12 @@ declare module 'nitropack' {
|
|
|
166
145
|
inline: [runtimeDir]
|
|
167
146
|
});
|
|
168
147
|
nitroConfig.virtual["#nuxt-og-image/constants"] = constScript;
|
|
148
|
+
nitroConfig.virtual["#nuxt-og-image/browser"] = `export { createBrowser } from '${runtimeDir}/browsers/${isEdge ? "lambda" : "default"}'`;
|
|
149
|
+
if (isEdge) {
|
|
150
|
+
["puppeteer", "bufferutil", "utf-8-validate"].forEach((name) => {
|
|
151
|
+
nitroConfig.alias[name] = "unenv/runtime/mock/proxy";
|
|
152
|
+
});
|
|
153
|
+
}
|
|
169
154
|
});
|
|
170
155
|
nuxt.hooks.hook("nitro:init", async (nitro) => {
|
|
171
156
|
let entries = [];
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
/// <reference types="node" />
|
|
2
2
|
import type { Browser } from 'playwright-core';
|
|
3
3
|
import type { ScreenshotOptions } from '../types';
|
|
4
|
-
export declare function createBrowser(): Promise<any>;
|
|
5
4
|
export declare function screenshot(browser: Browser, url: string, options: ScreenshotOptions): Promise<Buffer>;
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
export async function screenshot(browser, url, options) {
|
|
2
|
+
const page = await browser.newPage({
|
|
3
|
+
colorScheme: options.colorScheme
|
|
4
|
+
});
|
|
5
|
+
await page.setViewportSize({
|
|
6
|
+
width: options.width,
|
|
7
|
+
height: options.height
|
|
8
|
+
});
|
|
9
|
+
await page.goto(url, {
|
|
10
|
+
timeout: 1e4,
|
|
11
|
+
waitUntil: "networkidle"
|
|
12
|
+
});
|
|
13
|
+
if (options.mask) {
|
|
14
|
+
await page.evaluate((mask) => {
|
|
15
|
+
for (const el of document.querySelectorAll(mask))
|
|
16
|
+
el.style.display = "none";
|
|
17
|
+
}, options.mask);
|
|
18
|
+
}
|
|
19
|
+
if (options.selector)
|
|
20
|
+
await page.locator(options.selector).screenshot();
|
|
21
|
+
return await page.screenshot();
|
|
22
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare function createBrowser(): Promise<any>;
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
export async function createBrowser() {
|
|
2
|
+
try {
|
|
3
|
+
const playwrightCore = await import(String("playwright-core"));
|
|
4
|
+
const { Launcher } = await import(String("chrome-launcher"));
|
|
5
|
+
const chromePath = Launcher.getFirstInstallation();
|
|
6
|
+
return await playwrightCore.chromium.launch({
|
|
7
|
+
headless: true,
|
|
8
|
+
executablePath: chromePath
|
|
9
|
+
});
|
|
10
|
+
} catch (e) {
|
|
11
|
+
}
|
|
12
|
+
try {
|
|
13
|
+
const playwright = await import(String("playwright"));
|
|
14
|
+
return await playwright.chromium.launch({
|
|
15
|
+
headless: true
|
|
16
|
+
});
|
|
17
|
+
} catch (e) {
|
|
18
|
+
}
|
|
19
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare function createBrowser(): Promise<import("puppeteer-core").Browser>;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import edgeChromium from "chrome-aws-lambda";
|
|
2
|
+
import puppeteer from "puppeteer-core";
|
|
3
|
+
export async function createBrowser() {
|
|
4
|
+
return puppeteer.launch({
|
|
5
|
+
args: edgeChromium.args,
|
|
6
|
+
executablePath: await edgeChromium.executablePath,
|
|
7
|
+
headless: true
|
|
8
|
+
});
|
|
9
|
+
}
|
|
@@ -1,12 +1,15 @@
|
|
|
1
|
-
import { defineEventHandler, getRequestHeader, setHeader } from "h3";
|
|
2
|
-
import {
|
|
1
|
+
import { createError, defineEventHandler, getRequestHeader, setHeader } from "h3";
|
|
2
|
+
import { screenshot } from "../browserUtil.mjs";
|
|
3
3
|
import { DefaultRuntimeImageSuffix, HtmlRendererRoute } from "#nuxt-og-image/constants";
|
|
4
|
+
import { createBrowser } from "#nuxt-og-image/browser";
|
|
4
5
|
export default defineEventHandler(async (e) => {
|
|
5
6
|
if (!e.path?.endsWith(DefaultRuntimeImageSuffix))
|
|
6
7
|
return;
|
|
7
8
|
const path = e.path.replace(DefaultRuntimeImageSuffix, HtmlRendererRoute);
|
|
8
9
|
const host = getRequestHeader(e, "host") || "localhost:3000";
|
|
9
10
|
const browser = await createBrowser();
|
|
11
|
+
if (!browser)
|
|
12
|
+
return createError("Could not create browser");
|
|
10
13
|
setHeader(e, "Content-Type", "image/png");
|
|
11
14
|
return await screenshot(browser, `http${host.startsWith("localhost") ? "" : "s"}://${host}/${path}`, {
|
|
12
15
|
width: 1200,
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "nuxt-og-image",
|
|
3
3
|
"type": "module",
|
|
4
|
-
"version": "0.5.
|
|
4
|
+
"version": "0.5.3",
|
|
5
5
|
"packageManager": "pnpm@7.8.0",
|
|
6
6
|
"license": "MIT",
|
|
7
7
|
"funding": "https://github.com/sponsors/harlan-zw",
|
|
@@ -34,7 +34,6 @@
|
|
|
34
34
|
"fast-glob": "^3.2.12",
|
|
35
35
|
"ohash": "^1.0.0",
|
|
36
36
|
"pathe": "^1.0.0",
|
|
37
|
-
"playwright-core": "^1.28.1",
|
|
38
37
|
"radix3": "^1.0.0",
|
|
39
38
|
"ufo": "^1.0.1"
|
|
40
39
|
},
|
|
@@ -47,6 +46,7 @@
|
|
|
47
46
|
"bumpp": "^8.2.1",
|
|
48
47
|
"eslint": "8.29.0",
|
|
49
48
|
"nuxt": "npm:nuxt3@latest",
|
|
49
|
+
"playwright-core": "^1.28.1",
|
|
50
50
|
"puppeteer": "^19.4.0",
|
|
51
51
|
"vitest": "^0.25.5"
|
|
52
52
|
},
|
|
@@ -1,64 +0,0 @@
|
|
|
1
|
-
const debugBinaryUsage = (s, error) => {
|
|
2
|
-
if (!process.dev) {
|
|
3
|
-
console.log(s, error);
|
|
4
|
-
}
|
|
5
|
-
};
|
|
6
|
-
export async function createBrowser() {
|
|
7
|
-
try {
|
|
8
|
-
const playwrightCore = await import("playwright-core");
|
|
9
|
-
process.env.AWS_LAMBDA_FUNCTION_NAME = process.env.AWS_LAMBDA_FUNCTION_NAME || "RUNTIME_HACK";
|
|
10
|
-
const awsChrome = await import(String("chrome-aws-lambda"));
|
|
11
|
-
return await playwrightCore.chromium.launch({
|
|
12
|
-
args: awsChrome.args,
|
|
13
|
-
executablePath: await awsChrome.executablePath,
|
|
14
|
-
headless: awsChrome.headless
|
|
15
|
-
});
|
|
16
|
-
} catch (e) {
|
|
17
|
-
debugBinaryUsage("[nuxt-og-image] Skipping chrome-aws-lambda", e);
|
|
18
|
-
}
|
|
19
|
-
try {
|
|
20
|
-
const playwrightCore = await import("playwright-core");
|
|
21
|
-
const { Launcher } = await import("chrome-launcher");
|
|
22
|
-
const chromePath = Launcher.getFirstInstallation();
|
|
23
|
-
return await playwrightCore.chromium.launch({
|
|
24
|
-
headless: true,
|
|
25
|
-
executablePath: chromePath
|
|
26
|
-
});
|
|
27
|
-
} catch (e) {
|
|
28
|
-
debugBinaryUsage("[nuxt-og-image] Skipping chrome-launcher", e);
|
|
29
|
-
}
|
|
30
|
-
try {
|
|
31
|
-
const playwright = await import(String("playwright"));
|
|
32
|
-
return await playwright.chromium.launch({
|
|
33
|
-
headless: true
|
|
34
|
-
});
|
|
35
|
-
} catch (e) {
|
|
36
|
-
if (!process.dev)
|
|
37
|
-
debugBinaryUsage("[nuxt-og-image] Playwright failed", e);
|
|
38
|
-
throw new Error(`
|
|
39
|
-
Missing chromium binary. Please run "npx playwright install".
|
|
40
|
-
`);
|
|
41
|
-
}
|
|
42
|
-
}
|
|
43
|
-
export async function screenshot(browser, url, options) {
|
|
44
|
-
const page = await browser.newPage({
|
|
45
|
-
colorScheme: options.colorScheme
|
|
46
|
-
});
|
|
47
|
-
await page.setViewportSize({
|
|
48
|
-
width: options.width,
|
|
49
|
-
height: options.height
|
|
50
|
-
});
|
|
51
|
-
await page.goto(url, {
|
|
52
|
-
timeout: 1e4,
|
|
53
|
-
waitUntil: "networkidle"
|
|
54
|
-
});
|
|
55
|
-
if (options.mask) {
|
|
56
|
-
await page.evaluate((mask) => {
|
|
57
|
-
for (const el of document.querySelectorAll(mask))
|
|
58
|
-
el.style.display = "none";
|
|
59
|
-
}, options.mask);
|
|
60
|
-
}
|
|
61
|
-
if (options.selector)
|
|
62
|
-
await page.locator(options.selector).screenshot();
|
|
63
|
-
return await page.screenshot();
|
|
64
|
-
}
|