chroma.js icon indicating copy to clipboard operation
chroma.js copied to clipboard

Import as ES6 module

Open bolinocroustibat opened this issue 3 years ago • 2 comments

Hello,

When I import Chroma as a module:

import * as chroma from "chroma-js";
let minRandomColor = chroma.random();
let maxRandomColor = chroma.random();
let colors = chroma.scale([minRandomColor, maxRandomColor]).padding(0.05).colors(10);
let rgbColor = chroma(colors[i]).rgb();

...I get the following error regarding the last line: Uncaught TypeError: chroma is not a function

Any idea how I should import or call chroma?

bolinocroustibat avatar Mar 19 '21 11:03 bolinocroustibat

Have you tried just printing out what's in chroma?

  1. Let 1.mjs be import * as chroma from "chroma-js"; console.log(chroma)
  2. Run node --experimental-modules --es-module-specifier-resolution=node 1.mjs.

You will see that everything you want is actually in default. So instead of import * as chroma you just import chroma:

import chroma from "chroma-js"
let minRandomColor = chroma.random();
let maxRandomColor = chroma.random();
let colors = chroma.scale([minRandomColor, maxRandomColor]).padding(0.05).colors(10);
let rgbColor = chroma(colors[1]).rgb();
console.log(rgbColor)

Artoria2e5 avatar Apr 09 '21 15:04 Artoria2e5

I'm having trouble with this also, trying to use chroma in a Svelte component (with vite):

import chroma from 'chroma-js';
let f = chroma.scale() //VS code tells me .scale is not a function

See below, this is all I get on chroma. However chroma('#D4F880').darken().hex() does work.

image

Confirmed this is a problem related to svelte/vite. The import works with no problem in a simple node app.

ianengelbrecht avatar Sep 14 '22 16:09 ianengelbrecht