New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Uncaught TypeError: Cannot read property 'icon' of undefined #12278

Open
bschwartz757 opened this Issue Feb 7, 2018 · 17 comments

Comments

Projects
None yet
7 participants
@bschwartz757

bschwartz757 commented Feb 7, 2018

Hello,

I have an existing project using Bootstrap 3.3.7 and was using Fontawesome 4.7 until I attempted to upgrade to 5 today. The icons are currently rendering, but are causing a TypeError that's killing my page.

I'm doing SSR (using Pug), but including fontawesome in JS script:

var fontawesome = require('@fortawesome/fontawesome')
var faBrands = require('@fortawesome/fontawesome-free-brands')
var faSolid = require('@fortawesome/fontawesome-free-solid')
var faRegular = require('@fortawesome/fontawesome-free-regular')
fontawesome.library.add(faBrands)
fontawesome.library.add(faSolid)
fontawesome.library.add(faRegular)

and I'm getting the following error in the browser:
Uncaught TypeError: Cannot read property 'icon' of undefined

This seems to be causing the error (inside the js bundle):

function define(prefix, icons) {
  var normalized = Object.keys(icons).reduce(function (acc, iconName) {
    var icon = icons[iconName];
    var expanded = !!icon._icon_ [this is throwing the error, icon.icon doesn't seem to exist];

I'm using jQuery, but read https://fontawesome.com/how-to-use/svg-with-js#with-jquery. My <i> tags are all nested within a tags, and inspecting the DOM elements it looks like the svg replacement is happening fine and leaves the a tags intact. I do have a click listener attached to one of the a tags, but that shouldn't matter since the a tag isn't changed.

Any ideas?

@Evanslooten

This comment has been minimized.

Show comment
Hide comment
@Evanslooten

Evanslooten Feb 15, 2018

I have the same issue with a Laravel application using Backpack. The icons render mostly correctly, with the fa-angle-lefts on my sidebar menu being gigantic.

let fontawesome = require('@fortawesome/fontawesome');
let solid       = require('@fortawesome/fontawesome-pro-solid').default;
let regular     = require('@fortawesome/fontawesome-pro-regular');
let light       = require('@fortawesome/fontawesome-pro-light');
let brands      = require('@fortawesome/fontawesome-free-brands');

fontawesome.library.add(solid);
fontawesome.library.add(regular);
fontawesome.library.add(light);
fontawesome.library.add(brands);
mix.js('resources/assets/js/app.js', 'public/js')
   .js('resources/assets/js/font-awesome.js', 'public/js')
   .sass('resources/assets/sass/app.scss', 'public/css');
Uncaught TypeError: Cannot read property 'icon' of undefined
    at font-awesome.js:1528
    at Array.reduce (<anonymous>)
    at define (font-awesome.js:1526)
    at font-awesome.js:1575
    at Array.forEach (<anonymous>)
    at Library.add (font-awesome.js:1573)
    at Object.defineProperty.value (font-awesome.js:89)
    at __webpack_require__ (font-awesome.js:20)
    at Object.<anonymous> (font-awesome.js:75)
    at __webpack_require__ (font-awesome.js:20)

Evanslooten commented Feb 15, 2018

I have the same issue with a Laravel application using Backpack. The icons render mostly correctly, with the fa-angle-lefts on my sidebar menu being gigantic.

let fontawesome = require('@fortawesome/fontawesome');
let solid       = require('@fortawesome/fontawesome-pro-solid').default;
let regular     = require('@fortawesome/fontawesome-pro-regular');
let light       = require('@fortawesome/fontawesome-pro-light');
let brands      = require('@fortawesome/fontawesome-free-brands');

fontawesome.library.add(solid);
fontawesome.library.add(regular);
fontawesome.library.add(light);
fontawesome.library.add(brands);
mix.js('resources/assets/js/app.js', 'public/js')
   .js('resources/assets/js/font-awesome.js', 'public/js')
   .sass('resources/assets/sass/app.scss', 'public/css');
Uncaught TypeError: Cannot read property 'icon' of undefined
    at font-awesome.js:1528
    at Array.reduce (<anonymous>)
    at define (font-awesome.js:1526)
    at font-awesome.js:1575
    at Array.forEach (<anonymous>)
    at Library.add (font-awesome.js:1573)
    at Object.defineProperty.value (font-awesome.js:89)
    at __webpack_require__ (font-awesome.js:20)
    at Object.<anonymous> (font-awesome.js:75)
    at __webpack_require__ (font-awesome.js:20)
@tagliala

This comment has been minimized.

Show comment
Hide comment
@tagliala

tagliala Feb 15, 2018

Member

Hi!

Thanks for being part of the Font Awesome Community.

Sorry but I cannot help in your specific use case

Are you able to provide a reproducible test case?

Member

tagliala commented Feb 15, 2018

Hi!

Thanks for being part of the Font Awesome Community.

Sorry but I cannot help in your specific use case

Are you able to provide a reproducible test case?

@defaye

This comment has been minimized.

Show comment
Hide comment
@defaye

defaye Feb 15, 2018

Same issue with Laravel 5.5.34.

window.Vue = require('vue');

const fontawesome = require('@fortawesome/fontawesome');
const FontAwesomeIcon = require('@fortawesome/vue-fontawesome');
const fontawesomeProLight = require('@fortawesome/fontawesome-pro-light');
fontawesome.library.add(fontawesomeProLight);
Vue.component('font-awesome-icon', FontAwesomeIcon);

Error: Uncaught TypeError: Cannot read property 'icon' of undefined

function define(prefix, icons) {
  var normalized = Object.keys(icons).reduce(function (acc, iconName) {
    var icon = icons[iconName];
    var expanded = !!icon.icon;

defaye commented Feb 15, 2018

Same issue with Laravel 5.5.34.

window.Vue = require('vue');

const fontawesome = require('@fortawesome/fontawesome');
const FontAwesomeIcon = require('@fortawesome/vue-fontawesome');
const fontawesomeProLight = require('@fortawesome/fontawesome-pro-light');
fontawesome.library.add(fontawesomeProLight);
Vue.component('font-awesome-icon', FontAwesomeIcon);

Error: Uncaught TypeError: Cannot read property 'icon' of undefined

function define(prefix, icons) {
  var normalized = Object.keys(icons).reduce(function (acc, iconName) {
    var icon = icons[iconName];
    var expanded = !!icon.icon;
@defaye

This comment has been minimized.

Show comment
Hide comment
@defaye

defaye Feb 15, 2018

index.es.js:

function define(prefix, icons) {
  console.log("pro-light");
  console.log(icons);
  var normalized = Object.keys(icons).reduce(function (acc, iconName) {
    var icon = icons[iconName];
    console.log(iconName, icon);
    var expanded = !!icon.icon;

console:

faWindowRestore {prefix: "fal", iconName: "window-restore", icon: Array(5)}
app.js?id=b36e112de10c78243a99:823 faWonSign {prefix: "fal", iconName: "won-sign", icon: Array(5)}
app.js?id=b36e112de10c78243a99:823 faWrench {prefix: "fal", iconName: "wrench", icon: Array(5)}
app.js?id=b36e112de10c78243a99:823 faYenSign {prefix: "fal", iconName: "yen-sign", icon: Array(5)}
app.js?id=b36e112de10c78243a99:3623 {} "undefined" undefined

defaye commented Feb 15, 2018

index.es.js:

function define(prefix, icons) {
  console.log("pro-light");
  console.log(icons);
  var normalized = Object.keys(icons).reduce(function (acc, iconName) {
    var icon = icons[iconName];
    console.log(iconName, icon);
    var expanded = !!icon.icon;

console:

faWindowRestore {prefix: "fal", iconName: "window-restore", icon: Array(5)}
app.js?id=b36e112de10c78243a99:823 faWonSign {prefix: "fal", iconName: "won-sign", icon: Array(5)}
app.js?id=b36e112de10c78243a99:823 faWrench {prefix: "fal", iconName: "wrench", icon: Array(5)}
app.js?id=b36e112de10c78243a99:823 faYenSign {prefix: "fal", iconName: "yen-sign", icon: Array(5)}
app.js?id=b36e112de10c78243a99:3623 {} "undefined" undefined
@defaye

This comment has been minimized.

Show comment
Hide comment
@defaye

defaye Feb 15, 2018

I got beyond this issue by making the following changes:

function define(prefix, icons) {
  var normalized = Object.keys(icons).reduce(function (acc, iconName) {
    var icon = icons[iconName];
    if (icon) {
      var expanded = !!icon.icon;

      if (expanded) {
        acc[icon.iconName] = icon.icon;
      } else {
        acc[iconName] = icon;
      }
    }
    return acc;
  }, {});
  _byUnicode = lookup(function (acc, icon, iconName) {
    if (icon) {
      acc[icon[3]] = iconName;
    }

    return acc;
  });

  _byLigature = lookup(function (acc, icon, iconName) {
    if (icon) {
      var ligatures = icon[2];

      acc[iconName] = iconName;

      ligatures.forEach(function (ligature) {
        acc[ligature] = iconName;
      });
    }

    return acc;
  });

For some reason, I also got the following error:

app.js?id=4c1e65d490a5b4d7c41d:41164 [Vue warn]: Failed to mount component: template or render function not defined.

found in

---> <FontAwesomeIcon>

This was fixed by using ES6(?edit: said ES5 in error) import technique: (no idea why)

// const FontAwesomeIcon = require('@fortawesome/vue-fontawesome');
import FontAwesomeIcon from '@fortawesome/vue-fontawesome';

I also couldn't see subsequent icons using the following syntax:

<font-awesome-icon :icon="['fal', 'user']" />

I had to use:

                <font-awesome-icon :icon="['fal', 'user']"></font-awesome-icon>
                <font-awesome-icon :icon="['fab', 'facebook']"></font-awesome-icon>

defaye commented Feb 15, 2018

I got beyond this issue by making the following changes:

function define(prefix, icons) {
  var normalized = Object.keys(icons).reduce(function (acc, iconName) {
    var icon = icons[iconName];
    if (icon) {
      var expanded = !!icon.icon;

      if (expanded) {
        acc[icon.iconName] = icon.icon;
      } else {
        acc[iconName] = icon;
      }
    }
    return acc;
  }, {});
  _byUnicode = lookup(function (acc, icon, iconName) {
    if (icon) {
      acc[icon[3]] = iconName;
    }

    return acc;
  });

  _byLigature = lookup(function (acc, icon, iconName) {
    if (icon) {
      var ligatures = icon[2];

      acc[iconName] = iconName;

      ligatures.forEach(function (ligature) {
        acc[ligature] = iconName;
      });
    }

    return acc;
  });

For some reason, I also got the following error:

app.js?id=4c1e65d490a5b4d7c41d:41164 [Vue warn]: Failed to mount component: template or render function not defined.

found in

---> <FontAwesomeIcon>

This was fixed by using ES6(?edit: said ES5 in error) import technique: (no idea why)

// const FontAwesomeIcon = require('@fortawesome/vue-fontawesome');
import FontAwesomeIcon from '@fortawesome/vue-fontawesome';

I also couldn't see subsequent icons using the following syntax:

<font-awesome-icon :icon="['fal', 'user']" />

I had to use:

                <font-awesome-icon :icon="['fal', 'user']"></font-awesome-icon>
                <font-awesome-icon :icon="['fab', 'facebook']"></font-awesome-icon>
@bschwartz757

This comment has been minimized.

Show comment
Hide comment
@bschwartz757

bschwartz757 Feb 16, 2018

bschwartz757 commented Feb 16, 2018

@Evanslooten

This comment has been minimized.

Show comment
Hide comment
@Evanslooten

Evanslooten Feb 16, 2018

@tagliala I was able to reproduce this issue with a base install of Laravel. The steps I followed are listed below, please contact me directly and I can give you access to the Cloud9 test environment.

  1. Create environment and upgrade to PHP 7.1 & MySQL 5.7. Install and configure Laravel 5.5.
  2. Install Font Awesome via NPM
  3. Create font-awesome.js (resources/admin/js/font-awesome.js)
let fontawesome = require('@fortawesome/fontawesome');
let solid       = require('@fortawesome/fontawesome-pro-solid').default;
let regular     = require('@fortawesome/fontawesome-pro-regular');
let light       = require('@fortawesome/fontawesome-pro-light');
let brands      = require('@fortawesome/fontawesome-free-brands');

fontawesome.library.add(solid);
fontawesome.library.add(regular);
fontawesome.library.add(light);
fontawesome.library.add(brands);
  1. Add the created font-awesome.js to Mix (webpack.mix.js)
let mix = require('laravel-mix');

/*
 |--------------------------------------------------------------------------
 | Mix Asset Management
 |--------------------------------------------------------------------------
 |
 | Mix provides a clean, fluent API for defining some Webpack build steps
 | for your Laravel application. By default, we are compiling the Sass
 | file for the application as well as bundling up all the JS files.
 |
 */

mix.js('resources/assets/js/app.js', 'public/js')
   .js('resources/assets/js/font-awesome.js', 'public/js')
   .sass('resources/assets/sass/app.scss', 'public/css');
  1. Reference the mix asset in view file (welcome.blade.php)
    <script src="{{ mix('js/font-awesome.js') }}"></script>
  2. Run NPM to compile assets
    npm run dev
  3. Error appears in console when viewing project
font-awesome.js:1526 Uncaught TypeError: Cannot read property 'icon' of undefined
    at font-awesome.js:1526
    at Array.reduce (<anonymous>)
    at define (font-awesome.js:1524)
    at font-awesome.js:1573
    at Array.forEach (<anonymous>)
    at Library.add (font-awesome.js:1571)
    at Object.45 (font-awesome.js:86)
    at __webpack_require__ (font-awesome.js:20)
    at Object.44 (font-awesome.js:71)
    at __webpack_require__ (font-awesome.js:20)

Evanslooten commented Feb 16, 2018

@tagliala I was able to reproduce this issue with a base install of Laravel. The steps I followed are listed below, please contact me directly and I can give you access to the Cloud9 test environment.

  1. Create environment and upgrade to PHP 7.1 & MySQL 5.7. Install and configure Laravel 5.5.
  2. Install Font Awesome via NPM
  3. Create font-awesome.js (resources/admin/js/font-awesome.js)
let fontawesome = require('@fortawesome/fontawesome');
let solid       = require('@fortawesome/fontawesome-pro-solid').default;
let regular     = require('@fortawesome/fontawesome-pro-regular');
let light       = require('@fortawesome/fontawesome-pro-light');
let brands      = require('@fortawesome/fontawesome-free-brands');

fontawesome.library.add(solid);
fontawesome.library.add(regular);
fontawesome.library.add(light);
fontawesome.library.add(brands);
  1. Add the created font-awesome.js to Mix (webpack.mix.js)
let mix = require('laravel-mix');

/*
 |--------------------------------------------------------------------------
 | Mix Asset Management
 |--------------------------------------------------------------------------
 |
 | Mix provides a clean, fluent API for defining some Webpack build steps
 | for your Laravel application. By default, we are compiling the Sass
 | file for the application as well as bundling up all the JS files.
 |
 */

mix.js('resources/assets/js/app.js', 'public/js')
   .js('resources/assets/js/font-awesome.js', 'public/js')
   .sass('resources/assets/sass/app.scss', 'public/css');
  1. Reference the mix asset in view file (welcome.blade.php)
    <script src="{{ mix('js/font-awesome.js') }}"></script>
  2. Run NPM to compile assets
    npm run dev
  3. Error appears in console when viewing project
font-awesome.js:1526 Uncaught TypeError: Cannot read property 'icon' of undefined
    at font-awesome.js:1526
    at Array.reduce (<anonymous>)
    at define (font-awesome.js:1524)
    at font-awesome.js:1573
    at Array.forEach (<anonymous>)
    at Library.add (font-awesome.js:1571)
    at Object.45 (font-awesome.js:86)
    at __webpack_require__ (font-awesome.js:20)
    at Object.44 (font-awesome.js:71)
    at __webpack_require__ (font-awesome.js:20)
@tagliala

This comment has been minimized.

Show comment
Hide comment
@tagliala

tagliala Feb 16, 2018

Member

@Evanslooten thanks.

I'm not so much into node.js.

I can just see that you are not using the recommended way to load font awesome:

import fontawesome from '@fortawesome/fontawesome'
import solid from '@fortawesome/fontawesome-free-solid'
import faTwitter from '@fortawesome/fontawesome-free-brands/faTwitter'

// Add entire styles or individual icons
fontawesome.library.add(solid, faTwitter)

I see require and .default in your approach, but I don't know the differences with import

@robmadole could you please take a look at this?

Member

tagliala commented Feb 16, 2018

@Evanslooten thanks.

I'm not so much into node.js.

I can just see that you are not using the recommended way to load font awesome:

import fontawesome from '@fortawesome/fontawesome'
import solid from '@fortawesome/fontawesome-free-solid'
import faTwitter from '@fortawesome/fontawesome-free-brands/faTwitter'

// Add entire styles or individual icons
fontawesome.library.add(solid, faTwitter)

I see require and .default in your approach, but I don't know the differences with import

@robmadole could you please take a look at this?

@Evanslooten

This comment has been minimized.

Show comment
Hide comment
@Evanslooten

Evanslooten Feb 16, 2018

@tagliala
Changing font-awesome.js as follows does remove the console error. I still have issues with icons rendering strangely, but this is likely unrelated.

/*
Causes icon undefined error

let fontawesome = require('@fortawesome/fontawesome');
let solid       = require('@fortawesome/fontawesome-pro-solid').default;
let regular     = require('@fortawesome/fontawesome-pro-regular');
let light       = require('@fortawesome/fontawesome-pro-light');
let brands      = require('@fortawesome/fontawesome-free-brands');

fontawesome.library.add(solid);
fontawesome.library.add(regular);
fontawesome.library.add(light);
fontawesome.library.add(brands);
*/
/* Does not cause error */
import fontawesome from '@fortawesome/fontawesome'
import solid from '@fortawesome/fontawesome-pro-solid'
import regular from '@fortawesome/fontawesome-pro-regular'
import light from '@fortawesome/fontawesome-pro-light'
import brands from '@fortawesome/fontawesome-free-brands'

fontawesome.library.add(solid, regular, light, brands)

Evanslooten commented Feb 16, 2018

@tagliala
Changing font-awesome.js as follows does remove the console error. I still have issues with icons rendering strangely, but this is likely unrelated.

/*
Causes icon undefined error

let fontawesome = require('@fortawesome/fontawesome');
let solid       = require('@fortawesome/fontawesome-pro-solid').default;
let regular     = require('@fortawesome/fontawesome-pro-regular');
let light       = require('@fortawesome/fontawesome-pro-light');
let brands      = require('@fortawesome/fontawesome-free-brands');

fontawesome.library.add(solid);
fontawesome.library.add(regular);
fontawesome.library.add(light);
fontawesome.library.add(brands);
*/
/* Does not cause error */
import fontawesome from '@fortawesome/fontawesome'
import solid from '@fortawesome/fontawesome-pro-solid'
import regular from '@fortawesome/fontawesome-pro-regular'
import light from '@fortawesome/fontawesome-pro-light'
import brands from '@fortawesome/fontawesome-free-brands'

fontawesome.library.add(solid, regular, light, brands)
@defaye

This comment has been minimized.

Show comment
Hide comment
@defaye

defaye Feb 16, 2018

@Evanslooten are you telling me that if I just used import _ from _ I wouldn't have had this issue? require is in their docs! Sigh

defaye commented Feb 16, 2018

@Evanslooten are you telling me that if I just used import _ from _ I wouldn't have had this issue? require is in their docs! Sigh

@robmadole

This comment has been minimized.

Show comment
Hide comment
@robmadole

robmadole Feb 16, 2018

Collaborator

We missed the require issue in the docs. I'll get that fixed. Sorry @defaye.

Collaborator

robmadole commented Feb 16, 2018

We missed the require issue in the docs. I'll get that fixed. Sorry @defaye.

@robmadole

This comment has been minimized.

Show comment
Hide comment
@robmadole

robmadole Feb 16, 2018

Collaborator

Ok, I actually think I can work around the issue with CommonJS so that this doesn't create headaches for people. I'll get this on the bug list.

Collaborator

robmadole commented Feb 16, 2018

Ok, I actually think I can work around the issue with CommonJS so that this doesn't create headaches for people. I'll get this on the bug list.

@robmadole robmadole self-assigned this Feb 16, 2018

@robmadole robmadole added the bug label Feb 16, 2018

@robmadole

This comment has been minimized.

Show comment
Hide comment
@mlwilkerson

This comment has been minimized.

Show comment
Hide comment
@mlwilkerson

mlwilkerson Mar 22, 2018

Contributor

In Font Awesome 5.0.x, if you want to require the whole icon set, it should look like this:

const fas = require('@fortawesome/fontawesome-free-solid')['default']

(notice the ['default'] on the end, or it could be .default)
If you look here at @fortawesome/fontawesome-free-solid/index.js, you'll see that we have an export on the default key that is just the icon set, and it's in the structure expected by library.add().

If you do the require() without the ['default'] at the end, you're getting the whole exports object which is not the expected structure for library.add().

Here's a working demo in a repo that require()s a whole icon set, adds it to the library and reads something back out.

That demo repo has two branches, because the way we export stuff is different in our current 5.0.x releases from what our 5.1.x branch will look like once released (currently in pre-release). So its master branch is for the 5.1 approach, and the 5.0-dependencies branch is for the for the 5.0.x approach (which I assume is what matters for the situations posted above).

@bschwartz757 I'm curious to know what difference it would make if you made two changes to what you originally posted:

  1. Add the ['default'] to your require().
  2. Call library.add() only once, passing in everything together as a comma separate list of args.
    Like this:
var fontawesome = require('@fortawesome/fontawesome')
var faBrands = require('@fortawesome/fontawesome-free-brands')['default']
var faSolid = require('@fortawesome/fontawesome-free-solid')['default']
var faRegular = require('@fortawesome/fontawesome-free-regular')['default']
fontawesome.library.add(faBrands, faSolid, faRegular)
Contributor

mlwilkerson commented Mar 22, 2018

In Font Awesome 5.0.x, if you want to require the whole icon set, it should look like this:

const fas = require('@fortawesome/fontawesome-free-solid')['default']

(notice the ['default'] on the end, or it could be .default)
If you look here at @fortawesome/fontawesome-free-solid/index.js, you'll see that we have an export on the default key that is just the icon set, and it's in the structure expected by library.add().

If you do the require() without the ['default'] at the end, you're getting the whole exports object which is not the expected structure for library.add().

Here's a working demo in a repo that require()s a whole icon set, adds it to the library and reads something back out.

That demo repo has two branches, because the way we export stuff is different in our current 5.0.x releases from what our 5.1.x branch will look like once released (currently in pre-release). So its master branch is for the 5.1 approach, and the 5.0-dependencies branch is for the for the 5.0.x approach (which I assume is what matters for the situations posted above).

@bschwartz757 I'm curious to know what difference it would make if you made two changes to what you originally posted:

  1. Add the ['default'] to your require().
  2. Call library.add() only once, passing in everything together as a comma separate list of args.
    Like this:
var fontawesome = require('@fortawesome/fontawesome')
var faBrands = require('@fortawesome/fontawesome-free-brands')['default']
var faSolid = require('@fortawesome/fontawesome-free-solid')['default']
var faRegular = require('@fortawesome/fontawesome-free-regular')['default']
fontawesome.library.add(faBrands, faSolid, faRegular)
@bschwartz757

This comment has been minimized.

Show comment
Hide comment
@bschwartz757

bschwartz757 Apr 3, 2018

@mlwilkerson Thanks - that worked like a charm!

bschwartz757 commented Apr 3, 2018

@mlwilkerson Thanks - that worked like a charm!

@alexandrubau

This comment has been minimized.

Show comment
Hide comment
@alexandrubau

alexandrubau Jun 24, 2018

Or you could require only the icons you need (not the entire pack) like this:

let fasEnvelope = require('@fortawesome/free-solid-svg-icons/faEnvelope').definition;
let icons = [
    fasEnvelope
];
fa.library.add(icons);

alexandrubau commented Jun 24, 2018

Or you could require only the icons you need (not the entire pack) like this:

let fasEnvelope = require('@fortawesome/free-solid-svg-icons/faEnvelope').definition;
let icons = [
    fasEnvelope
];
fa.library.add(icons);
@robmadole

This comment has been minimized.

Show comment
Hide comment
@robmadole

robmadole Jun 27, 2018

Collaborator

@alexandrubau the add() method does not take an array argument.

Try:

const fasEnvelope = require('@fortawesome/free-solid-svg-icons/faEnvelope').definition;
fa.library.add(fasEnvelope);
Collaborator

robmadole commented Jun 27, 2018

@alexandrubau the add() method does not take an array argument.

Try:

const fasEnvelope = require('@fortawesome/free-solid-svg-icons/faEnvelope').definition;
fa.library.add(fasEnvelope);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment