material design - missing icons with Snowpack + Svelte + svelte-materialify

Question

I am trying to get snowpack to work with svelte-materialify. I created an app with create-snowpack-app svelte-snowpack --template @snowpack/app-template-svelte, followed by yarn install svelte-materialify.

All the CSS seem to work, a simple MaterialApp with a demo AppBar works: CSS, light/dark theme, animations etc. - except that the icons are completely missing. No error in Js console.

On the snoepack site, there are examples for webpack and rollup - these don't seem to be necessary for snowpack - the postcss plugin is already activated, and seems to do the trick here. So, everything fine, except for icons.

Any thoughts?

question from:https://stackoverflow.com/questions/65849920/missing-icons-with-snowpack-svelte-svelte-materialify

Answer 1

Alternative solution First you have to install the icons package

npm install --save svelte-icons

then you have to import each icon separately Example

<script>
   import MdShoppingCart from 'svelte-icons/md/MdShoppingCart.svelte'
   <MdShoppingCart/>
</script>

For more icons enter this link https://svelte-icons.vercel.app/

Choose a library, and click on the icon to get the import code then use it as a tag