Rfcs/issue 955 layouts and pages #1212

thescientist13 · 2024-03-16T16:55:06Z

Related Issue

resolves #955 and fixes #1044 and #988

Summary of Changes

Rename templates/ directory to layouts/
Refactor SSR pipeline to reduce duplicate / redundant SSR operations
Support custom elements as layouts
Support custom static and dynamic formats for pages and SSR page / API routes (respectively)
Enabled dynamic pages / API routes support for TypeScript plugin
Move API Routes to be file based routing under the pages directory
Updated relevant documentation

TODO

rebase against release branch (and reconcile Lit polyfill refactoring)
confirm bug fixes are fixed downstream with TT - Feature/issue 82 social links bar AnalogStudiosRI/www.tuesdaystunes.tv#115
Custom elements as layouts
Additional languages (e.g. TS, markdown) for pages as
- ~~static pages~~
- ~~dynamic pages + .ts example~~
- ~~APIs~~
Documentation / breaking changes
- layouts
  - frontmatter
  - getLayout
  - context plugin
  - graphql
- custom pages (needs custom loaders)
- typescript plugin README
Upstreams
- TypeScript parsing support wcc#161

seeing a circular dependency with sucrase?

     Circular dependency: ../../../../../node_modules/sucrase/dist/esm/parser/tokenizer/index.js -> ../../../../../node_modules/sucrase/dist/esm/parser/traverser/util.js -> ../../../../../node_modules/sucrase/dist/esm/parser/tokenizer/index.js
     Circular dependency: ../../../../../node_modules/sucrase/dist/esm/parser/tokenizer/index.js -> ../../../../../node_modules/sucrase/dist/esm/parser/tokenizer/readWord.js -> ../../../../../node_modules/sucrase/dist/esm/parser/tokenizer/index.js
     Circular dependency: ../../../../../node_modules/sucrase/dist/esm/parser/index.js -> ../../../../../node_modules/sucrase/dist/esm/parser/traverser/index.js -> ../../../../../node_modules/sucrase/dist/esm/parser/traverser/statement.js -> ../../../../../node_modules/sucrase/dist/esm/parser/index.js
     Circular dependency: ../../../../../node_modules/sucrase/dist/esm/parser/plugins/flow.js -> ../../../../../node_modules/sucrase/dist/esm/parser/traverser/expression.js -> ../../../../../node_modules/sucrase/dist/esm/parser/plugins/flow.js
     Circular dependency: ../../../../../node_modules/sucrase/dist/esm/parser/traverser/expression.js -> ../../../../../node_modules/sucrase/dist/esm/parser/plugins/jsx/index.js -> ../../../../../node_modules/sucrase/dist/esm/parser/traverser/expression.js
     Circular dependency: ../../../../../node_modules/sucrase/dist/esm/parser/traverser/expression.js -> ../../../../../node_modules/sucrase/dist/esm/parser/plugins/jsx/index.js -> ../../../../../node_modules/sucrase/dist/esm/parser/plugins/typescript.js -> ../../../../../node_modules/sucrase/dist/esm/parser/traverser/expression.js
     Circular dependency: ../../../../../node_modules/sucrase/dist/esm/parser/plugins/flow.js -> ../../../../../node_modules/sucrase/dist/esm/parser/traverser/expression.js -> ../../../../../node_modules/sucrase/dist/esm/parser/plugins/jsx/index.js -> ../../../../../node_modules/sucrase/dist/esm/parser/plugins/typescript.js -> ../../../../../node_modules/sucrase/dist/esm/parser/traverser/lval.js -> ../../../../../node_modules/sucrase/dist/esm/parser/plugins/flow.js
     Circular dependency: ../../../../../node_modules/sucrase/dist/esm/parser/plugins/typescript.js -> ../../../../../node_modules/sucrase/dist/esm/parser/traverser/lval.js -> ../../../../../node_modules/sucrase/dist/esm/parser/plugins/typescript.js
     Circular dependency: ../../../../../node_modules/sucrase/dist/esm/parser/traverser/expression.js -> ../../../../../node_modules/sucrase/dist/esm/parser/plugins/jsx/index.js -> ../../../../../node_modules/sucrase/dist/esm/parser/plugins/typescript.js -> ../../../../../node_modules/sucrase/dist/esm/parser/traverser/lval.js -> ../../../../../node_modules/sucrase/dist/esm/parser/traverser/expression.js
     Circular dependency: ../../../../../node_modules/sucrase/dist/esm/parser/traverser/statement.js -> ../../../../../node_modules/sucrase/dist/esm/parser/plugins/flow.js -> ../../../../../node_modules/sucrase/dist/esm/parser/traverser/expression.js -> ../../../../../node_modules/sucrase/dist/esm/parser/plugins/jsx/index.js -> ../../../../../node_modules/sucrase/dist/esm/parser/plugins/typescript.js -> ../../../../../node_modules/sucrase/dist/esm/parser/traverser/statement.js
     Circular dependency: ../../../../../node_modules/sucrase/dist/esm/parser/plugins/jsx/index.js -> ../../../../../node_modules/sucrase/dist/esm/parser/plugins/typescript.js -> ../../../../../node_modules/sucrase/dist/esm/parser/plugins/jsx/index.js
     Circular dependency: ../../../../../node_modules/sucrase/dist/esm/parser/traverser/expression.js -> ../../../../../node_modules/sucrase/dist/esm/parser/plugins/types.js -> ../../../../../node_modules/sucrase/dist/esm/parser/traverser/expression.js
     Circular dependency: ../../../../../node_modules/sucrase/dist/esm/parser/plugins/flow.js -> ../../../../../node_modules/sucrase/dist/esm/parser/traverser/expression.js -> ../../../../../node_modules/sucrase/dist/esm/parser/plugins/types.js -> ../../../../../node_modules/sucrase/dist/esm/parser/plugins/flow.js
     Circular dependency: ../../../../../node_modules/sucrase/dist/esm/parser/traverser/statement.js -> ../../../../../node_modules/sucrase/dist/esm/parser/plugins/flow.js -> ../../../../../node_modules/sucrase/dist/esm/parser/traverser/expression.js -> ../../../../../node_modules/sucrase/dist/esm/parser/traverser/statement.js
     Circular dependency: ../../../../../node_modules/sucrase/dist/esm/parser/traverser/statement.js -> ../../../../../node_modules/sucrase/dist/esm/parser/plugins/flow.js -> ../../../../../node_modules/sucrase/dist/esm/parser/traverser/statement.js

Remove default layout content
Collapse /api/ directory - enable mixed content in the API pages directory #1246

Thoughts / Questions

(breaking) APIs in the pages/ directory? - Yes - Rfcs/issue 955 layouts and pages #1212 (comment)
- I think so, to not "leak" as much greenwood to the user, and to avoid routing conflicts

(breaking) remove default content? - Yes - Rfcs/issue 955 layouts and pages #1212 (comment)

if (body.indexOf('<content-outlet></content-outlet>') > 0) {
  body = body.replace('<content-outlet></content-outlet>', `
    <h1>Welcome to Greenwood!</h1>
  `);
}

Use <slot> instead of <content-outlet>? Or maybe not? - Won't Do
Entire main logic of bundleSsrPages should probably happen in the pool too? Not sure, it worked previously without this particular detail... 🤷‍♂️ - support prerender during development #1249

Nice to have / standalone issues

Dynamic / static layouts including context plugins - dynamic runtime layouts for SSR #1248
I think with custom resource types for pages, this should enable .md to be a generic file format so it could become a standalone plugin - standalone rehype based markdown plugin #1247
Per evaluate (remove) use of Workers for SSR and prerendering #1088, templates are currently static only for SSR pages, but would be nice to change that - dynamic runtime layouts for SSR #1248
- https://github.com/ProjectEvergreen/greenwood/pull/1110/files#diff-036193aa52a1863fc84a1878a4026f259d3605cdc9c0312d3dba861b80b7bb35R199
revisit  implementation - support prerender during development #1249
In preRenderCompilationWorker could we consolidate into ONE SSR call? (instead serve + execute-route-module) - support prerender during development #1249
- would this be the same solution needed for pre-rendering in development too?
- would this tie into the Workers refactor discussion?
prerendering in development - support prerender during development #1249
Trailing forward slash configuration (/) - configuration option for trailing forward slash #1176

* isolation mode for SSR pages and API routes for greenwood serve * documentation for isolation mode option and global config test case * misc refactoring * set isolation mode to true for Lit renderer plugin * set isolation mode to true for Lit renderer plugin

…1186) * Issue-1118: Refactor rollup config generation for APIs * Issue-1118: Refactor rollup config generation for SSR * Issue-1118: Refactor forEach to use for-in for the ssr config generation * Issue-1118: Convert forEach to for..in * Issue-1118: Remove unused code * refactor away bundling work arounds and add comments * refactor SSR page bundling to avoid hacky entry point placeholder hack * patch custom element registry check from wcc * refactor SSR page output name from .entry to .route * document breaking changes for adapter plugins * refactor import meta relative asset path escaping * refactor API routes and adapters for mapped API bundles * misc refactoring and docs update * latest WCC patches * windows compatibility * update adapter docs example * remove patches --------- Co-authored-by: Owen Buckley <owenbuckley13@gmail.com>

* intial draft of import attributes support for CSS and JSON * all test cases passing * need patch package * wcc patches for import attributes and CSSStylesheet shim * bump min NodeJS version for exp specs * temp disable ESLint * develop based import assertion specs * serve based import attributes specs * add preIntercept resource plugin lifecycle and refactor PostCSS to use it * all test cases passing for import attributes support * refactor built in CSS and JSON intercepting * demo code * raw plugin docs and package.json updates * update latest documentation for custom loaders support in NodeJS * update custom import docs * upgrade wcc v0.13.0 * only need Node 18 for github actions * css imports and raw plugin interop with test cases * lit renderer import attribute test cases and documentation * refactor matchers support for raw plugin instead of patching and add test cases * disable describe.only * update usage for custom resource plugins to showcase usage of import attributes * document preIntercept lifecycle and convert Babel to use it * restore ESLint * enable debug logging for failing specs * refactor theme pack specs * fix linting * remove CSS and JSON packages from being publishable * clean up console logs and comments * rename exp test cases to loadersnaming prefix * fix command in github actions * remove plugin-import-css callout from plugin-postcss README * remove demo code from website * refine PostCSS plugin intercepting

…lls removal from CLI

thescientist13 · 2024-06-19T23:44:31Z

(breaking) APIs in the pages/ directory?
I think so, to not "leak" as much greenwood to the user, and to avoid routing conflicts

So one thing that would be good is to support both "pages" and APIs within this joined directory, e.g

src/
  pages/
     components/
       greeting.js
     api/
       login.js (will be an actual API - /api/login - server rendered)
       login-client.html (will just be an HTML page - /api/login-client/ - static rendered)
     docs/
       login-client.html (will just be an HTML page)
     index.html
     about.js

thescientist13 · 2024-06-19T23:50:47Z

if (body.indexOf('<content-outlet></content-outlet>') > 0) {
  body = body.replace('<content-outlet></content-outlet>', `
    <h1>Welcome to Greenwood!</h1>
  `);
}

From our chat today, I think this indeed better placed into the path of our init package / starter kits and templates.

thescientist13 · 2024-06-21T20:49:21Z

Follow up issue for mixed content in the API pages directory - #1246

thescientist13 added RFC Proposal and changes to workflows, architecture, APIs, etc CLI labels Mar 16, 2024

thescientist13 self-assigned this Mar 16, 2024

thescientist13 changed the base branch from master to release/0.30.0 March 16, 2024 16:57

thescientist13 added breaking bug Something isn't working labels Mar 16, 2024

thescientist13 force-pushed the rfcs/issue-955-layouts-and-pages branch from ab0ae10 to 31f8f35 Compare March 16, 2024 18:17

thescientist13 added the documentation Greenwood specific docs label Mar 16, 2024

This was linked to issues Mar 16, 2024

warnings emitted about undefined page level custom element tags when pre-rendering SSR pages #988

Closed

duplicate HTML when using prerender and shared components used in both SSR pages and templates #1044

Closed

thescientist13 added the Plugins Greenwood Plugins label Mar 16, 2024

thescientist13 mentioned this pull request Apr 28, 2024

bug/issue 1223 handle incorrect nested SSR page bundle output name mapping #1224

Merged

4 tasks

thescientist13 added the question Further information is requested label May 19, 2024

thescientist13 force-pushed the rfcs/issue-955-layouts-and-pages branch from d5fb5c6 to 796d713 Compare May 19, 2024 23:37

thescientist13 force-pushed the release/0.30.0 branch from c6fb518 to bb4fdc5 Compare June 1, 2024 14:18

thescientist13 and others added 13 commits June 2, 2024 14:02

v0.30.0-alpha.1

0a863c1

first pass on resource tracking and bundling refactor with lit polyfi…

8b9ed0c

…lls removal from CLI

interim work around to solve double rendering and undefined WCC bugs

2a69b1e

refactor frontmatter for graph and standard html plugin for SSR

cc92114

rename templates directory to layouts

50ce060

refactor over bundling of static script assets in bundleSsrPages

9c04d37

handle bundling styles within bundleSsrPages

c1f7a5d

post rebase tweaks

116e650

custom elements as layouts

5600d70

post rebase tweaks

712f60f

thescientist13 force-pushed the rfcs/issue-955-layouts-and-pages branch from 796d713 to 712f60f Compare June 2, 2024 19:24

thescientist13 added the SSR label Jun 2, 2024

thescientist13 added 6 commits June 15, 2024 14:44

WCC patched support for TS pages

a316173

support and tests for API routes as a custom dynamic format

123ce94

restore TS tests and make servePage default

dd7b9a2

document custom page format support

84b4bfd

fix lint

335900f

patch latest WCC TypeScript changes

4ae525d

thescientist13 marked this pull request as ready for review June 18, 2024 02:06

thescientist13 added 2 commits June 19, 2024 21:44

cleanup default app layout content

de67e52

handle rollup circular dependency warnings for API routes

1be3fe1

thescientist13 mentioned this pull request Jun 21, 2024

enable mixed content in the API pages directory #1246

Open

This was referenced Jun 21, 2024

standalone rehype based markdown plugin #1247

Open

dynamic runtime layouts for SSR #1248

Open

thescientist13 added 2 commits June 21, 2024 17:29

rename test cases from templates to layout

dc05943

collapse API routes directory into pages directory

b997e7d

thescientist13 removed the question Further information is requested label Jun 22, 2024

bump to wc-compiler 0.14.0

1b8bbd5

thescientist13 merged commit 87cdf8d into release/0.30.0 Jun 22, 2024
8 checks passed

thescientist13 deleted the rfcs/issue-955-layouts-and-pages branch June 22, 2024 16:49

thescientist13 mentioned this pull request Jun 22, 2024

getting started documentation not reflecting name change to layouts #1252

Closed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Rfcs/issue 955 layouts and pages #1212

Rfcs/issue 955 layouts and pages #1212

thescientist13 commented Mar 16, 2024 •

edited

Loading

thescientist13 commented Jun 19, 2024

thescientist13 commented Jun 19, 2024

thescientist13 commented Jun 21, 2024

Rfcs/issue 955 layouts and pages #1212

Rfcs/issue 955 layouts and pages #1212

Conversation

thescientist13 commented Mar 16, 2024 • edited Loading

Related Issue

Summary of Changes

TODO

Thoughts / Questions

Nice to have / standalone issues

thescientist13 commented Jun 19, 2024

thescientist13 commented Jun 19, 2024

thescientist13 commented Jun 21, 2024

thescientist13 commented Mar 16, 2024 •

edited

Loading