janosh / svicons Goto Github PK

Getting "Cannot find module '@svicons/ionicons-solid/trophy.svelte' or its corresponding type declarations.ts(2307)" on:

<script lang="ts">
  import Trophy from '@svicons/ionicons-solid/trophy.svelte';
</script>

In VSCode despite the icon actually working when doing <Trophy/>. I installed it with npm i -D @svicons/ionicons-solid.

Not sure if this is something you can fix, but perhaps it's an issue with the way you're exporting the icons in the js/ts files.

Hey! I'm looking for a suitable icon package and was wondering why you decided to create these standalone packages in addition to svelte-icons. Could you explain your rationale? (And maybe add it to the README). Thanks.

How use selve updated icons?

Can the icon pack be local?

I was wondering if you would consider merging the different icon styles into one package per icon pack. For example you would do:

<script lang="ts">
import Trophy from '@svicons/ionicons/trophy.svelte';
</script>

<Trophy style="solid" width="38px" height="38px" color="black"/>
<Trophy style="outline" width="20px" height="20px" color="red"/>

Hi Janosh,

Would it be possible to add a class or attribute to target custom styling so for example I could make all icons a certain size and colour which could then be overridden by local svelte module styles or the existing colour and width parameters. I can do this:

 <Alarm/>

<style>
  :global(svg){
      margin: 1rem;
      width: 2rem;
      color: red;
  }
</style>

but I'd like to be able to be more specific, eg:

<style>
  :global(svg.svicon){
      margin: 1rem;
      width: 2rem;
      color: red;
  }
</style>

to avoid interfering with other svgs that may be on the same page.

Someone just reported an error using @svicons/ionicons-outline in the SvelteKit Discord. I expect the issue is that it has:

  "module": "./index.js",
  "type": "module",

That's not valid because both the main and svelte fields are missing. You don't need module if you have "type": "module". I'd suggest updating it to:

  "type": "module",
  "main": "./index.js",
  "svelte": "./index.js",