Cannot read property 'prefix' of undefined

[phuze]

Describe the bug After updating @fortawesome/fontawesome-svg-core from 1.2.33-alpha3 to 1.2.35, icons can no longer be found.

To Reproduce I'm using tree shaking as outlined in FortAwesome/vue-fontawesome. Here's a CodeSandbox test case which shows an error:

Cannot read property 'prefix' of undefined

Expected behavior I expect the icons to load.

Screenshots

Version and implementation Version: "@fortawesome/fontawesome-svg-core": "^1.2.35" Browser and version: Microsoft Edge Version 90.0.818.62 (Official build) (64-bit)

• [X] SVG with JS
• [ ] Web Fonts with CSS
• [ ] SVG Sprites
• [ ] On the Desktop

Bug report checklist

• [X] I have filled out as much of the above information as I can
• [X] I have included a test case because my odds go way up that the team can fix this when I do
• [X] I have searched for existing issues and to the best of my knowledge this is not a duplicate

[tagliala]

Hi!

Thanks for being part of the Font Awesome Community and for this thorough bug report

Disclaimers:

• I'm not a JavaScript nor a VUE developer
• I can't install fontawesome-svg-core 1.2.33-alpha3, has it been yanked from NPM?
• The provided test case tries to load fa-angle-down in regular style from the Free set, which is not available. I'm going to assume that using farStar for this purpose is the same.

I can see that the provided App.vue references the icons in this way:

    <fa :icon="['fas', 'fa-bell']" />
    <fa :icon="['far', 'fa-angle-down']" />

From fontawesome-vue documentation, I can see that the correct usage is to omit the fa- prefix from the icon name, so it should be:

    <fa :icon="['fas', 'bell']" />
    <fa :icon="['far', 'angle-down']" />

Icons do work in this updated test case: https://codesandbox.io/s/elated-smoke-iuymr

I've searched in the fontawesome-vue docs and I cannot find examples where fa-* prefixes are included. I do not exclude the possibility that there has been a breaking change, but I've got the same results with the 1.2.32 core version so that's the best I can do.

Could you please dobule check that your application is referencing icons in the proper way?

[phuze]

Thanks for the reply.

In order to install @fontawesome-svg-core version 1.2.33-alpha, i used npm i @fortawesome/fontawesome-svg-core@next. I just uninstalled and reinstalled it, and I can confirm it's still available on NPM. I will note though, that i'm using the private/pro NPM repository npm.fontawesome.com rather than the public.

I recall having picked up this install reference in some piece of documentation somewhere on the main fontawesome.com website, shortly after having purchased a Pro license. It stemmed from my endeavours to try out the new thin icon pack (note my inclusion of "@fortawesome/pro-thin-svg-icons": "^6.0.0-alpha2". Whatever documentation it was that I read, was prefixing icon names with fa-.

I will agree, as you noted, the main documentation for fontawesome-vue does not prefix icon names with fa-.

I've updated my fontawesome-svg-core to 1.2.35 and changed all of the syntax throughout my application. I can confirm icons are working again, with the exception of thin icons. I am no longer able to make use of thin icons, regardless if I prefix them with fa- or not.

1.2.33-alpha3 allows me to use thin icons, and requires icon names to be prefixed with fa- 1.2.35 does not allow me to use thin icons, and requires icon names not be prefixed with fa-

Are you able to shed any light on why this is the case?

[tagliala]

Thanks for the clarification

Are you able to shed any light on why this is the case?

Nope! I have some hypothesis, I would think that 1.2.33 alpha allows 6.0 icons, and 1.2.35 stable doesn't, but this might not be accurate

Let's ask @robmadole directly

[tagliala]

@robmadole another question: is using FA5 stable side by side with FA6 (alpha or stable) a supported use case?

[robmadole]

Hi @phuze. We've just released beta1 so I think it's worth trying the newer versions.

It's important, for now, that the correct versions are installed:

@fortawesome/fontawesome-svg-core@1.2.33-beta1 @fortawesome/pro-thin-svg-icons@6.0.0-beta1

We also have some update beta documentation here.

Can you try this again and let me know what you find?