Skip to main content

Preact + deno convertion of react-icons

This library is a simple port from react-icons compatible with deno fresh project.

The React Icons doc The for fresh version is here if you have time to help the project is here

setup

To use it simply fill your import_map.json

{
  "imports": {
    "preact":  "https://esm.sh/preact@10.15.1",
    "preact/": "https://esm.sh/preact@10.15.1/",
    "react-icons/ai":  "https://deno.land/x/react_icons_ai/mod.ts",
    "react-icons/bs":  "https://deno.land/x/react_icons_bs/mod.ts",
    "react-icons/bi":  "https://deno.land/x/react_icons_bi/mod.ts",
    "react-icons/ci":  "https://deno.land/x/react_icons_ci/mod.ts",
    "react-icons/di":  "https://deno.land/x/react_icons_di/mod.ts",
    "react-icons/fi":  "https://deno.land/x/react_icons_fi/mod.ts",
    "react-icons/fc":  "https://deno.land/x/react_icons_fc/mod.ts",
    "react-icons/fa":  "https://deno.land/x/react_icons_fa/mod.ts",
    "react-icons/gi":  "https://deno.land/x/react_icons_gi/mod.ts",
    "react-icons/go":  "https://deno.land/x/react_icons_go/mod.ts",
    "react-icons/gr":  "https://deno.land/x/react_icons_gr/mod.ts",
    "react-icons/hi":  "https://deno.land/x/react_icons_hi/mod.ts",
    "react-icons/im":  "https://deno.land/x/react_icons_im/mod.ts",
    "react-icons/md":  "https://deno.land/x/react_icons_md/mod.ts",
    "react-icons/ri":  "https://deno.land/x/react_icons_ri/mod.ts",
    "react-icons/si":  "https://deno.land/x/react_icons_si/mod.ts",
    "react-icons/sl":  "https://deno.land/x/react_icons_sl/mod.ts",
    "react-icons/tb":  "https://deno.land/x/react_icons_tb/mod.ts",
    "react-icons/ti":  "https://deno.land/x/react_icons_ti/mod.ts",
    "react-icons/wi":  "https://deno.land/x/react_icons_wi/mod.ts",
    "react-icons/cg":  "https://deno.land/x/react_icons_cg/mod.ts",
    "react-icons/tfi": "https://deno.land/x/react_icons_tfi/mod.ts",
    "react-icons/vsc": "https://deno.land/x/react_icons_vsc/mod.ts"
  }
}

Now just use it like in a regular React app, bur with Preact

sample

import { AiFillAccountBook } from "react-icons/ai";

export default function TesSvg() {
  return (<AiFillAccountBook />)
}

Check the full documetation in: here

the first sample:

import { FaBeer } from 'react-icons/fa';
class Question extends React.Component {
  render() {
    return <h3> Lets go for a <FaBeer />? </h3>
  }
}

can be convert as:

import { FaBeer } from 'react-icons/fa';
import { Component } from 'preact'

class Question extends Component {
  render() {
    return <h3> Lets go for a <FaBeer />? </h3>
  }
}