Why is the final bundle so big?

[paulogr]

Hi, i'm using this package for while and looking at the code and dependencies can't figure out why the final bundle has 79.5kb minified.

Can someone help me to figure out why?

Thanks!

[ghost]

Is there anyway I could only import what I only need?
I've checked the bundled size and it is importing everything that the component offers.

How do I modify it to only import Photoshop or Sketch only for example ?

[guanzo]

This library should be tree shakeable, 100%. It's way too big. Especially since most users will only import 1 or a few components.

@paulogr @davidmandeeli

In the meantime, if you have something like this

import { Sketch as SketchPicker } from 'vue-color'

You can replace it with

import SketchPicker from 'vue-color/src/components/Sketch'

I've verified that the resulting bundle is much smaller. From 80kib to 13kib

[paulogr]

Uow man, thanks, it helps a lot!

I'm using the Chrome picker was reduced from 80kb to 27kb, the +14kb it's for tinycolor dependency.

[yellow1912]

Not sure if this works with the latest version anymore, I keep getting "vue-color\src\components\Chrome doesn't exist"

I think it expects a .js file while the src is a .vue file?

[linx4200]

Hi all,

v3.0 is ready and it supports tree-shaking. Try it out now: npm install vue-color@next;