diff --git a/packages/lit-dev-content/site/docs/v2/ssr/server-usage.md b/packages/lit-dev-content/site/docs/v2/ssr/server-usage.md index 7e06a5fce..0467f8608 100644 --- a/packages/lit-dev-content/site/docs/v2/ssr/server-usage.md +++ b/packages/lit-dev-content/site/docs/v2/ssr/server-usage.md @@ -30,6 +30,7 @@ The template can contain custom elements, which are rendered in turn, along with ```ts import {render} from '@lit-labs/ssr'; +import {html} from 'lit'; const result = render(html`

Hello SSR!

@@ -68,6 +69,7 @@ This is the preferred way to handle SSR results when integrating with a streamin ```ts import {render} from '@lit-labs/ssr'; import {RenderResultReadable} from '@lit-labs/ssr/lib/render-result-readable.js'; +import {html} from 'lit'; // Using Koa to stream app.use(async (ctx) => { @@ -87,9 +89,10 @@ app.use(async (ctx) => { ```ts import {render} from '@lit-labs/ssr'; import {collectResult} from '@lit-labs/ssr/lib/render-result.js'; +import {html} from 'lit'; const result = render(html``); -const html = await collectResult(result); +const contents = await collectResult(result); ``` #### `collectResultSync()` @@ -103,10 +106,11 @@ Because this function doesn't support async rendering, it's recommended to only ```ts import {render} from '@lit-labs/ssr'; import {collectResultSync} from '@lit-labs/ssr/lib/render-result.js'; +import {html} from 'lit'; const result = render(html``); // Throws if `result` contains a Promise! -const html = collectResultSync(result); +const contents = collectResultSync(result); ``` ### Render options diff --git a/packages/lit-dev-content/site/docs/v3/ssr/server-usage.md b/packages/lit-dev-content/site/docs/v3/ssr/server-usage.md index 728c81621..bb8bee447 100644 --- a/packages/lit-dev-content/site/docs/v3/ssr/server-usage.md +++ b/packages/lit-dev-content/site/docs/v3/ssr/server-usage.md @@ -30,6 +30,7 @@ The template can contain custom elements. If the custom elements are defined on ```ts import {render} from '@lit-labs/ssr'; +import {html} from 'lit'; // Import `my-element` on the server to server render it. import './my-element.js'; @@ -42,6 +43,7 @@ const result = render(html` To render a single element, you render a template that only contains that element: ```ts +import {html} from 'lit'; import './my-element.js'; const result = render(html``); @@ -72,6 +74,7 @@ This is the preferred way to handle SSR results when integrating with a streamin ```ts import {render} from '@lit-labs/ssr'; import {RenderResultReadable} from '@lit-labs/ssr/lib/render-result-readable.js'; +import {html} from 'lit'; // Using Koa to stream app.use(async (ctx) => { @@ -91,9 +94,10 @@ app.use(async (ctx) => { ```ts import {render} from '@lit-labs/ssr'; import {collectResult} from '@lit-labs/ssr/lib/render-result.js'; +import {html} from 'lit'; const result = render(html``); -const html = await collectResult(result); +const contents = await collectResult(result); ``` #### `collectResultSync()` @@ -107,10 +111,11 @@ Because this function doesn't support async rendering, it's recommended to only ```ts import {render} from '@lit-labs/ssr'; import {collectResultSync} from '@lit-labs/ssr/lib/render-result.js'; +import {html} from 'lit'; const result = render(html``); // Throws if `result` contains a Promise! -const html = collectResultSync(result); +const contents = collectResultSync(result); ``` ### Render options