Documentation incorrect?

[kevinpapst]

Hi @easylogic

thanks for this great project, looks very promising!

I am running into an issue, which was reported in the past multiple times, see eg. #24, #28, #29, #32

My problem: I cannot get the color picker up and running, my webpack compile always fails with:

Module build failed: Module not found:
./node_modules/codemirror-colorpicker/dist/codemirror-colorpicker.js contains a reference to the file codemirror.
This file can not be found, please check it for typos or update it if the file got moved.

I assume you use it always in a larger context and the complete frontend stack is your normal working environment.
But I am failing currently and wonder if you could have a look at the documentation.

Some of the linked jsfiddles link to a codemirror.js file, so I assume I have to require/import more files.

Can you give me a hint what to do?

[easylogic]

hi @kevinpapst

Thanks for your reporting.

codemirror is currently peerDependency.

so you must load codemirror before run colorpicker.

Show me the sample code and I'll look at it a bit more.

[kevinpapst]

Ok, so running yarn add codemirror-colorpicker is not enough?

Could you have a look at the examples in the README.md and explain the complete installation steps for a basic setup?

Just to make it a bit easier for a newbie to start using your color picker?

I am talking about this line and the following examples:
https://github.com/easylogic/codemirror-colorpicker/blame/master/README.md#L28

It seems there is something missing, probably yarn add codemirror?

And then on the website the examples start with

import ColorPickerUI from '@easylogic/colorpicker'

which doesn't work at all (missing files). If I replace it with

import ColorPickerUI from 'codemirror-colorpicker'

I run into the mentioned compile issues.

Probably the mixed examples come from the two distinct npm packages that exist? That is not really explained as well.

To wrap it up: your library looks amazing and I know writing documentation sucks, but maybe you could try to look at it from an outside perspective and add the missing points? Maybe it is totally obvious what's missing, but I am a backend developer and the modern frontend stack always feels a bit magical to me 😬

[easylogic]

@kevinpapst

I will test it with some bundlers (snowpack, rollup, webpack).

I'll let you know when the test is over

[easylogic]

@kevinpapst

I have a question.

Do you use this library on codemirror?

[kevinpapst]

I don't know what you mean with on codemirror. But I tried to use it as stand-alone library in a web project (using yarn and webpack).

[easylogic]

ok,

If you want a stand-alone library , you must use https://github.com/easylogic/colorpicker.

codemirror-colorpicker is working on codemirror.

[kevinpapst]

Oh really - what a shame ... sorry 😊

Then let me share my findings, just to let you know what went wrong:

• codemirror is nothing that triggers anything on my end, so it is a differentiation that does not work for everyone
• both GitHub projects share the same documentation page
• the difference between the projects is not explained
• the NPM project pages both have the same description This project was created to implement a color picker. It implemented basic functions for color and implemented image filters.
• the codemirror npm project has more recent updates

I love your project, don't get me wrong. It is just complicated to get started - really no offense! Just a tiny bit more documentation would be great.

Sorry for the noise then, I will give it a try!
And thanks for your project 👍

[easylogic]

Thanks for the good comment. Let's try to reinforce the document.

If you have any features you need, please tell me.