How to implement dynamic icon loading in remix.js?

342 views Asked by At

I would like to use some icon library in remix.js. As remix doesn't use babel it is not possible to use dynamic import of the icons. What is the easiest way to implement fontwaesome or remixicons with dynamic import?

I do not want to declare each icon to use inside my project. I would like to use something like an icon component to insert an icon.

1

There are 1 answers

1
Kiliman On

If you have access to the raw SVG files, the best way is to simply reference them as <img src="/path/to/icon.svg" />

Another option is to use SVG sprites. https://benadam.me/thoughts/react-svg-sprites/

I have a tool that will generate SVG sprites and create an <Icon> component to reference the sprites.

https://github.com/kiliman/rmx-cli#-svg-sprite--new