Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add svg spritsheet support and Icon component #38

Open
wants to merge 1 commit into
base: vite
Choose a base branch
from

Conversation

theokbokki
Copy link
Member

Suite au passage à vite, on à plus de solution pour utiliser facilement une iconfont.
Du coup on en est arrivé à la conclusion que le mieux c'est d'utiliser une spritesheet svg.

Void à déjà mis ça en place sur Hiker en utilisant ce plugin vite.

Sauf que ce plugin est pas archi top parce que il fonctionne que quand JS est actif, et il inclut toute la spritesheet à la fin du HTML.

Du coup j'ai fait un peu de recherche et j'ai trouvé ce plugin qui fonctionne quand JS est désactivé et qui crée un vrai fichier pour la spritesheet. (Et qui peut aussi générer plusieurs spritesheet et permet l'utilisation dans le css si jamais on à besoin).

Je l'ai déjà mis en place sur Hiker Website et @voidgraphics m'a demandé de le mettre sur Laravel Preset.

J'en ai profité pour créer un composant Icon qu'on pourra mettre dans les composants réutilisables (Comme dans IconButton qui fonctionne avec un iconfont pour le moment).

Il n'y a rien de particulier à savoir pour l'utiliser, juste qu'il faut faire yarn build pour générer la spritesheet. (Et du coup rebuild a chaque fois qu'on rajoute/modifier un icone mais ça c'est logique)

Le seul truc notable c'est que pour le moment il y a un bug avec ce plugin ou le HMR ne fonctionne pas avec Laravel en mode dev. En attendant que ce bug soit fixé il y a un workaround en faisant du cache busting manuel et on pourra changer quand ce sera fix :))

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant