grubersjoe / react-github-calendar

A React component to display a GitHub contributions calendar
https://grubersjoe.github.io/react-github-calendar
MIT License
453 stars 40 forks source link

TypeError: chroma__default.default.scale is not a function #105

Closed winnllam closed 1 month ago

winnllam commented 1 month ago

I installed the package but when trying to run my application I run into the following error

import GitHubCalendar from "react-github-calendar";
...
<GitHubCalendar username="winnllam" />

image

I have tried installing chroma-js as well but it did not fix the issue. My application is also using tailwind.css, not sure if that impacts this.

Please advise, thank you!

grubersjoe commented 1 month ago

Hey. What environment are you using (Next.js, Remix, Vite, Create React App etc.)? Can you verify that the installed chroma-js version is the correct one (should be ^2.4.2, see package.json of react-activity-calendar)? In particular it should not be v3.

Tried the current version in Vite using npm create vite and it renders just fine:

image

Tailwind should not play a role. Another thing you can try:

rm -rf node_modules/
npm install
winnllam commented 1 month ago

Hey! I'm using Create React App. This is how my dependencies and their versions look like.

image

Ran the removal and npm install again but still having the same issue.

grubersjoe commented 1 month ago

Ah I remember now, it did sound familiar. This is an issue within CRA and there's not much this project can do, see here (the last comment especially):

https://github.com/grubersjoe/react-activity-calendar/issues/105

(This component uses react-activity-calendar internally.)

winnllam commented 1 month ago

Managed to get it working with the workaround you linked, thanks for the help!