[cookbook idea] Simple, customisable static icons using provide / inject
See original GitHub issueA cool addition to the icons example would to use provide/inject
rather than building a bunch of discrete icon files and having to import them all.
This way, you only ever need to update the icons.js
file, and provide/inject allows the single Icon class to render different content without any additional edits or imports.
Additionally, you can also just save icons as raw SVGs which keeps them editable AND previewable!
Gist here: https://gist.github.com/davestewart/54b6823a76500fdcdd918fc5ce575d4c
Issue Analytics
- State:
- Created 6 years ago
- Comments:7 (4 by maintainers)
Top Results From Across the Web
A curated list of awesome things related to Vue.js - GitHub
js SSR boilerplate with Nuxt, Element (custom theme) and Vue Apollo. vue-daily-zhihu a simple demo build with Vue 2.0 & vue-router & vuex...
Read more >Icon System with SVG Sprites - CSS-Tricks
Icon System with SVG Sprites · Combine the .svg files · Inject that SVG at the top of the document · Use the...
Read more >Dependency injection in Android | Android Developers
Static solutions that generate the code to connect dependencies at compile time. Dagger is a popular dependency injection library for Java, ...
Read more >How to Create a Portfolio Website Using HTML, CSS ...
Then I'll show you how to create a beautiful responsive portfolio website for yourself using HTML, CSS, JavaScript and Bootstrap version 5.
Read more >4. Serial Communications - Arduino Cookbook [Book] - O'Reilly
The Arduino IDE (described in Recipe 1.3) provides a Serial Monitor (shown ... the “right way” is the one you find easiest to...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
I prefer using
icons
directly overprovide/inject
, like:The cookbook is intended to show people a deep dive into a certain way of working, while also showing alternative methods. The other way of working you showed skips out on many important steps: optimizing, making the SVGs accessible, and making them editable. Using icons in myriad ways across a codebase is extremely important. Optimization is also an important step- I worked on a codebase where I reduced the load from 10 seconds to 2 seconds by properly optimizing their SVG!
Even using the loaders have a number of steps to have them work properly.
Every way of working has it’s benefits, and it’s pitfalls. If you’d like to submit a recipe, I’m all for it. If this issue is submitted because it’s not your personal preference to work the way that the recipe suggests, I’ll close the issue, you don’t have to work that way 😃