icons-pack / svelte-simple-icons Goto Github PK
View Code? Open in Web Editor NEW📦 This package provides the Simple Icons packaged as a set of Svelte components.
License: MIT License
📦 This package provides the Simple Icons packaged as a set of Svelte components.
License: MIT License
I decided to use this library to add an icon to an app I am developing [0]. I really only need the Github [1] icon, but the way this is structured, I pay the cost to add all the icons. That's a bundle of about 5 MB uncompressed and ~1.1 MB compressed.
Because the components are auto sufficient, at least the GitHub one, I was able to just copy that Svelte file to the repo and remove the dependency. Now the app bundle is under 16 KB.
[0] https://base16-showcase.vercel.app/
[1] https://github.com/icons-pack/svelte-simple-icons/blob/main/src/components/Github.svelte
From the next major release of simple-icons
(v11, releasing on May 26, 2024), We will begin removing third-party extensions from our README list that are not up to date with at least the previous major release.
For example, when v11 is released, we will remove any extensions that don't support v10.0.0 or higher.
There are two methods that prove most popular among other maintainers. It is up to you which you implement.
@latest
from a CDNProjects that use the CDN version of the project (jsDelivr/unpkg) can keep up to date simply by changing the version number in their code to @latest. That way - you're always using the most up to date version of the icon package.
Many of our third party contributors make use of GitHub actions, and a weekly CRON job to query that the version number of the main package has changed, and then update and build their own package. A great example of this is the DrawIO package by mondeja. The main package is released consistently on a Sunday - so we recommend running your CRON job on a Monday or Tuesday.
When you've got your extension running one of the above methods, drop us a Pull Request to update your version number on the README.
If you're in need of any support in implementing one of the above - please feel free to start a discussion or ask us on Discord.
Here is the demo.
It doesn't work locally either.
Have you added index.js to export all icons?
And this is what I got localhost:
<Svelte> is not a valid SSR component. You may need to review your build config to ensure that dependencies are compiled, rather than imported as pre-compiled modules
This Package should have type definitions.
Normally, we only utilize a small subset of icons within the project. However, including just a single icon significantly increases compile time by several minutes. This can be optimized!
I've submitted a pull request #80 that drastically reduces compile times while maintaining single icon inclusion. Please consider reviewing the PR.
Thanks.
When attempting to use with Sapper, the following error is generated:
<Facebook> is not a valid SSR component. You may need to review your build config to ensure that dependencies are compiled, rather than imported as pre-compiled modules
Sapper requires the original component source in order to build for server-side rendering.
See here: https://github.com/sveltejs/sapper-template#using-external-components
The current build structure for this package does not allow accessing the original component source. E.g. it does not work if installed as a dependency nor devDependency.
You may want to support Sapper-friendly exports to the uncompiled icon .svelte files within the package.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.