@projectevergreen/astro-wcc NPM

astro-wcc

An Astro integration for SSR Web Components using WCC.

Usage

Install the plugin into your Astro project
```
$ npm i @projectevergreen/astro-wcc
```

Then add it to your Astro configuration file

import { defineConfig } from 'astro/config';
import astroWcc from '@projectevergreen/astro-wcc';

export default defineConfig({
  integrations: [ astroWcc() ]
});

You can now use a component in an Astro file

<!-- src/pages/index.astro -->
<html lang="en">
  <head>
    <script src="../components/greeting.js"></script>
  </head>
  <body>
    <x-greeting></x-greeting>
  </body>
</html>

Caveats

Currently assumes <x-${tagName}> maps to src/components/${tagName}.js
Client hints (e.g. <x-greeting client:visible>) are not supported

Astro WCC Web Components SSR

1 year ago

1 year ago

1 year ago

1 year ago