clarify importing modules in SSR pages

fixes #1403
ProjectEvergreen · Feb 4, 2025 · 767c812 · 767c812
1 parent 80f50e1
commit 767c812
Showing 1 changed file with 5 additions and 2 deletions.
diff --git a/src/pages/docs/pages/server-rendering.md b/src/pages/docs/pages/server-rendering.md
@@ -24,7 +24,7 @@ The above would serve content in a browser at the path _/users/_.
 
 In your page file, Greenwood supports the following functions that you can `export` for providing server rendered content and [frontmatter](/docs/resources/markdown/) to produce the `<body><body>` content for your page.
 
-- **default** (recommended): Use the custom elements API to render out your page content, aka **Web (Server) Components**. _This will take precedence over `getBody`_ and will also automatically track your custom element dependencies (in place of having to define frontmatter imports in `getFrontmatter`).
+- **default** (recommended): Use the custom elements API to render out your page content, aka **Web (Server) Components**. _This will take precedence over `getBody`_ and will also automatically track your custom element dependencies (in place of having to define frontmatter imports in `getFrontmatter`). However, any custom elements tracked by this automatic dependency management _must_ be able to render on the server. Any elements that require the browser should be imported using the imports field in `getFrontmatter`.
 - **getBody**: Return a string of HTML for the contents of the page
 - **getLayout**: Return a string of HTML to act as the [page's layout](/docs/pages/layouts/#pages)
 - **getFrontmatter**: Provide an object of [frontmatter](/docs/resources/markdown/#frontmatter) properties. Useful in conjunction with [content as data](/docs/content-as-data/), or otherwise setting static configuration / metadata through SSR.
@@ -209,7 +209,10 @@ Any Greenwood supported frontmatter can be returned here. _This is only run once
       collection: "header",
       order: 1,
       title: `The ${route} page`,
-      imports: ["/components/user.js"],
+      imports: [
+        "/components/user.js",
+        "/components/otherItem.js type=module"
+      ],
       data: {
         /* ... */
       },