Problem:

coreui.io Template => Most of the icons do not work out of the box.

Tipical error:
CIcon component: icon name 'cilindustry' does not exist in React.icons object.
To use icons by 'name' prop you need to make them available globally by adding them to React.icons object.
CIcon component docs: https://coreui.io/react/docs/components/CIcon

 

Solution:

in src/index.js we can find:
import { icons } from'./assets/icons'
React.icons = icons

But not all of the free icons are imported by default.
You will need to add the icons you wish to use to the src/assets/icons/index.js file.


import {
    ...
    cilIndustry,
    ...
} from '@coreui/icons'>

export const icons = Object.assign({}, {
    ...
    cilIndustry,
    ...
})


After importing the icons you wish to use, you can use the icon by name:
<CIcon name="cil-industry" />

 

Note:

To find the best icon for your needs, the best way is to use https://icons.coreui.io/icons/