Materialdesign: Is it possible to reference an icon via an alias?

Created on 8 Apr 2020  路  2Comments  路  Source: Templarian/MaterialDesign


In some cases, the alias names are more meaningful with the purpose I'm using the icons for. Tried using an alias with the webfont but I don't see an icon unless I use the actual icon name.

I'm looking at moving to SVG via JS anyway, but I also don't see any aliases in the JS library e.g.

export var mdiAccountOutline = "M12,4A4,4 0 0,1 16,8A4,4 0 0,1 12,12A4,4 0 0,1 8,8A4,4 0 0,1 12,4M12,6A2,2 0 0,0 10,8A2,2 0 0,0 12,10A2,2 0 0,0 14,8A2,2 0 0,0 12,6M12,13C14.67,13 20,14.33 20,17V20H4V17C4,14.33 9.33,13 12,13M12,14.9C9.03,14.9 5.9,16.36 5.9,17V18.1H18.1V17C18.1,16.36 14.97,14.9 12,14.9Z";
export var mdiPersonOutline = mdiAccountOutline

Are the aliases only to aid in searching?

Question

Most helpful comment

Yes the aliases are for search purposes. If using @mdi/js you could give the icon your own alias as you import it.

import { mdiAccount as mdiPerson } from '@mdi/js'
import { mdiAccount } from '@mdi/js'

const icons = {
    person: mdiAccount,
}

All 2 comments

Yes the aliases are for search purposes. If using @mdi/js you could give the icon your own alias as you import it.

import { mdiAccount as mdiPerson } from '@mdi/js'
import { mdiAccount } from '@mdi/js'

const icons = {
    person: mdiAccount,
}

Aliases are not unique, so you'll need to define your favorite name. James' solution is recommended.

We reuse aliases all the time. They are just there to make searching easier. 馃憤

Was this page helpful?
0 / 5 - 0 ratings

Related issues

EdricChan03 picture EdricChan03  路  3Comments

buutqn picture buutqn  路  3Comments

danielhickman picture danielhickman  路  3Comments

Templarian picture Templarian  路  3Comments

vishnu1991 picture vishnu1991  路  3Comments