adopt usage of Constructable Stylesheets

[thescientist13]

Once supported by the Lit team for SSR it would be nice to adopt CSS Module scripts in place of our inline usage of CSS

    -------------------------------------------------------
    Welcome to Greenwood (v0.30.0-alpha.2) ♻️
    -------------------------------------------------------
    Initializing project config
    Initializing project workspace contexts
    Generating graph of workspace files...
    building from local sources...
    (node:49224) ExperimentalWarning: `--experimental-loader` may be removed in the future; instead use `register()`:
    --import 'data:text/javascript,import { register } from "node:module"; import { pathToFileURL } from "node:url"; register("./node_modules/%40greenwood/cli/src/loader.js", pathToFileURL("./"));'
    (Use `node --trace-warnings ...` to show where the warning was created)
node:internal/process/promises:288
            triggerUncaughtException(err, true /* fromPromise */);
            ^
ReferenceError [Error]: CSSStyleSheet is not defined

  

Before

import { LitElement, html, css } from 'lit';

export class Card extends LitElement {
  static properties = {
    title: '',
    thumbnail: ''
  };
  static styles = css`
    div {
      display: flex;
      flex-direction: column;
      /* ... */
    }
  `;

  // ...
}

customElements.define('app-card', Card);

After

/* card.css */
div {
  display: flex;
  flex-direction: column;
  /* ... */
}

import { LitElement, html, css } from 'lit';
import sheet from './card.css' with { type: 'css' };

export class Card extends LitElement {
  static properties = {
    title: '',
    thumbnail: ''
  };
  static styles = [sheet];

  // ...
}

customElements.define('app-card', Card);

[thescientist13]

This may require a Node version bump depending on whatever Vercel's current supported version of NodeJS is 18.19.x

SyntaxError [Error]: Unexpected token 'with'
14:22:57.610 | at ModuleLoader.moduleStrategy (node:internal/modules/esm/translators:152:18)
14:22:57.610 | at ModuleLoader.moduleProvider (node:internal/modules/esm/loader:298:14)
14:22:57.610 |  
14:22:57.610 | Node.js v18.19.1
14:22:57.634 | Error: Command "node --loader ./node_modules/@greenwood/cli/src/loader.js ./node_modules/.bin/greenwood build" exited with 1
14:22:57.851