aykutkardas / react-icomoon

It makes it very simple to use SVG icons in your React and React-Native projects.
https://svgps.app
MIT License
216 stars 22 forks source link

TypeError: item.properties is undefined #29

Closed azcn2503 closed 2 years ago

azcn2503 commented 2 years ago

Hello,

It looks like the iconset JSON exported from the IcoMoon App (https://icomoon.io/app/#/select) is not providing a properties prop within its icon definitions any more.

Example of an icon definition taken from the JSON:

    {
      "paths": [
        "M320 192c0-106.039 85.961-192 192-192s192 85.961 192 192c0 106.039-85.961 192-192 192s-192-85.961-192-192zM768.078 448h-35.424l-199.104 404.244 74.45-372.244-96-96-96 96 74.45 372.244-199.102-404.244h-35.424c-127.924 0-127.924 85.986-127.924 192v320h768v-320c0-106.014 0-192-127.922-192z"
      ],
      "tags": [
        "user-tie",
        "user",
        "user-employee",
        "profile",
        "avatar",
        "person",
        "member",
        "job",
        "official"
      ],
      "defaultCode": 59766,
      "grid": 16
    },

So trying to render an icon using a icon prop throws an error due to the check here: https://github.com/aykutkardas/react-icomoon/blob/master/src/index.tsx#L60 since properties is undefined.

aykutkardas commented 2 years ago

Icomoon gives this file when you download it as a font.

Step 1: Select icons

Step 2: Click Generate Font image

Step 3: Download Font image

The zip you downloaded will contain a selection.json file.


I will soon announce a project that facilitates this process. By using this project instead of Icomoon, you will be able to generate the selection.json file in seconds. 🎉

azcn2503 commented 2 years ago

Much appreciated! I was using the menu at the top right of the app to download the selection JSON.