Material Web featuring Material Design 2 enables the use of web components such as mwc-button. This can be done by importing a module from unpkg or transpiling (or bundling) it to a JavaScript file (e.g. mwc-bundle-button.js) from the NPM package.
<script defer
type="module"
src='https://unpkg.com/@@material/mwc-button?module'>
</script>
or
<script defer
type="module"
src='../(path)/web-components/mwc-bundle-button.js'>
</script>
<mwc-button label="button label"></mwc-button>
When it comes to Material Web with Material You (Material Design 3), as of June 29, 2022, there is still no NPM package (@material/web) available.
I am eager to experiment with some web components using Material You, but I am unsure about how to transpile the repository into JavaScript files.
My approach so far has been:
- Cloning the Lit starter kit (potentially incorporating Lit into material-web)
- Downloading the material-web repository within the [Lit starter kit]
build(possibly usingtsc) for transpiling icon.ts into JavaScript filesrollup -cto bundle everything into one JavaScript file
However, I encountered the error
TS2307: Cannot find module './lib/icon-styles.css' or its corresponding type declarations.Am I on the right track? (Can I achieve my goal by resolving these errors?)
Or, could there be a misunderstanding in my approach?