bundle size

[nativanando]

Hi, I've been using phosphor-react in some projects and I identified some bundle size problems.. Analysing the bundle I could realize that phosport-react is using almost 60% of the space used.

I don't know it's the expected behavior so I opened this issue to report this situation!

[rektdeckard]

The react library fully supports tree-shaking, so it likely comes down to your bundler configuration or the way you're importing the icons. In apps bootstrapped with create-react-app, or when using most modern bundlers, simply using destructuring imports should work fine:

import { Smiley, Rainbow } from "phosphor-react";

Using the default import, import Phosphor from "phosphor-react"; or importing everything import * as Icons from "phosphor-react"; may or may not import the entire contents of the library, so try not to do that.

If you need to, you can import icons directly from the bundled source:

import Smiley from "phosphor-react/dist/icons/Smiley.esm.js";

[nativanando]

Thanks for the explanation, I was using destructuring imports and the bundle was still big.. But, Happily the problem was in the lib version I was using (1.0.0) I've just updated to 1.2.1 and, great news, problem solved!! 😄

[dnsking]

This is still happening in [1.4.1]

[Adam-Collier]

Same here using 1.4.0!

[JoTrdl]

I confirm, still happening in 1.4.1

[lmichailian]

Some news on this ?

[rektdeckard]

@lmichailian can you provide details on your environment, bundler, and usage? As stated before, the current version of this package is tree-shakeable, but that does not mean your bundler can do it.