ckeditor / ckeditor5

Powerful rich text editor framework with a modular architecture, modern integrations, and features like collaborative editing.
https://ckeditor.com/ckeditor-5
Other
8.27k stars 3.59k forks source link

Support getting content-styles.css from ckeditor5 dependency #16277

Open plsdev89 opened 3 weeks ago

plsdev89 commented 3 weeks ago

📝 Provide a description of the new feature

What is the expected behavior of the proposed feature?

I came across the Content Styles documentation at https://ckeditor.com/docs/ckeditor5/latest/installation/advanced/content-styles.html#sharing-content-styles-between-frontend-and-backend.

So, I understand what is needed to display CKEditor 5 formatted HTML properly. In the documentation, the recommended solution is to include content-styles.css as a static resource and attach the ck-content class name to the wrapper.

But let's consider the following scenario: I am using CKEditor 5 in a React app and saving CKEditor 5 formatted HTML to the backend. On the frontend, I retrieve it from the backend and render it using the html-react-parser library.

However, I don't understand why it's necessary to include additional content-styles.css even though we've already included the CKEditor 5 dependency on Frontend. Why doesn't the CKEditor 5 library export content-styles.css in the first place?

If we don't have the ckeditor5 dependency, it makes sense to include content-styles.css, otherwise not.

I could be wrong, correct me please. Thank you!


If you'd like to see this feature implemented, add a 👍 reaction to this post.

Witoso commented 2 weeks ago

That's because of historical nuances of CKEditor setup, which uses style-loader from webpack. As this was the default behavior, the CSS was not distributed. We are changing this with #15502, and when we release it, CSS will be a part of the packages.

CKEditorBot commented 5 days ago

The issue lacks the feedback we asked for two weeks. Hence, we've marked it as stale and will close it in 30 days. We understand it may still be relevant, so if you're interested in the solution, leave a comment or reaction under this issue.