colorjs / color-namer

:art: Give me a color and I'll name it.
MIT License
441 stars 39 forks source link

Two Questions: Not working in Svelte, and File size #21

Open justingolden21 opened 2 years ago

justingolden21 commented 2 years ago

So when I try importing in Svelte, I get the following error in console:

npm run dev

> color-convert@1.0.0 dev
> svelte-kit dev

Pre-bundling dependencies:
  svelte/store
  svelte
  color-namer
  dino-color-picker
  lodash.merge
  (...and 5 more)
(this will be run only when your dependencies or config have changed)
 > node_modules/d/index.js:7:30: error: Could not read from file: C:\Users\justi\Documents\GitHub\colorpicker\node_modules\es5-ext\string\index.js#\contains
    7 │   , contains        = require("es5-ext/string/#/contains");
      ╵                               ~~~~~~~~~~~~~~~~~~~~~~~~~~~

 > node_modules/es6-iterator/index.js:3:23: error: Could not read from file: C:\Users\justi\Documents\GitHub\colorpicker\node_modules\es5-ext\array\index.js#\clear    
    3 │ var clear    = require("es5-ext/array/#/clear")
      ╵                        ~~~~~~~~~~~~~~~~~~~~~~~

> Build failed with 2 errors:
node_modules/d/index.js:7:30: error: Could not read from file: C:\Users\justi\Documents\GitHub\colorpicker\node_modules\es5-ext\string\index.js#\contains
node_modules/es6-iterator/index.js:3:23: error: Could not read from file: C:\Users\justi\Documents\GitHub\colorpicker\node_modules\es5-ext\array\index.js#\clear       
Error: Build failed with 2 errors:
node_modules/d/index.js:7:30: error: Could not read from file: C:\Users\justi\Documents\GitHub\colorpicker\node_modules\es5-ext\string\index.js#\contains
node_modules/es6-iterator/index.js:3:23: error: Could not read from file: C:\Users\justi\Documents\GitHub\colorpicker\node_modules\es5-ext\array\index.js#\clear       
    at failureErrorWithLog (C:\Users\justi\Documents\GitHub\colorpicker\node_modules\esbuild\lib\main.js:1493:15)
    at C:\Users\justi\Documents\GitHub\colorpicker\node_modules\esbuild\lib\main.js:1151:28
    at runOnEndCallbacks (C:\Users\justi\Documents\GitHub\colorpicker\node_modules\esbuild\lib\main.js:941:63)
    at buildResponseToResult (C:\Users\justi\Documents\GitHub\colorpicker\node_modules\esbuild\lib\main.js:1149:7)
    at C:\Users\justi\Documents\GitHub\colorpicker\node_modules\esbuild\lib\main.js:1258:14
    at C:\Users\justi\Documents\GitHub\colorpicker\node_modules\esbuild\lib\main.js:629:9
    at handleIncomingPacket (C:\Users\justi\Documents\GitHub\colorpicker\node_modules\esbuild\lib\main.js:726:9)
    at Socket.readFromStdout (C:\Users\justi\Documents\GitHub\colorpicker\node_modules\esbuild\lib\main.js:596:7)
    at Socket.emit (node:events:390:28)
    at Socket.emit (node:domain:475:12)

And on page:

SyntaxError 500
The requested module '/node_modules/lodash.merge/index.js' does not provide an export named 'default'

I've been dealing with this error seemingly forever, but the project worked fine until I added this package, and removing it makes it work fine again.

import namer from 'color-namer'; results in this error and so does the async way:

onMount(async () => {
        const namer = await import('color-namer');

My second question is why the file size is so massive. 118.2kb for something with a file size that should be almost entirely composed of the lists of colors it uses is a bit much to me. Compressed, the colors should probably only be 40kb or so as a rough guess. I was just wondering why the code is 9000+ lines and why there are so many dependencies.

This package looks awesome, nice work and can't wait to use it. Thanks in advance.