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.69k stars 3.62k forks source link

Integrating Ckeditor in an Nx monorepo #16603

Open sc-mavirdol opened 1 week ago

sc-mavirdol commented 1 week ago

πŸ“ Provide detailed reproduction steps (if any)

  1. Please check the repository at https://github.com/sc-mavirdol/poc-ckeditor

βœ”οΈ Expected result

The build completes without errors.

❌ Actual result

poc-ckeditor/node_modules/@ckeditor/ckeditor5-widget/theme/widgettypearound.css Unknown word

1 | import api from "!../../../style-loader/dist/runtime/injectStylesIntoStyleTag.js"; | ^ 2 | import content from "!!../../../css-loader/dist/cjs.js!../../../postcss-loader/dist/cjs.js??ruleSet[1].rules[10].use[2]!./widgettypearound.css"; 3 |

at Object.<anonymous> (poc-ckeditor/node_modules/@nx/webpack/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[6].oneOf[4].use[1]!/poc-ckeditor/node_modules/@nx/webpack/node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[6].oneOf[4].use[2]!/poc-ckeditor/node_modules/style-loader/dist/cjs.js??ruleSet[1].rules[10].use[0]!/poc-ckeditor/node_modules/css-loader/dist/cjs.js!/poc-ckeditor/node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[10].use[2]!/poc-ckeditor/node_modules/@ckeditor/ckeditor5-widget/theme/widgettypearound.css:1:7)
at /poc-ckeditor/node_modules/webpack/lib/javascript/JavascriptModulesPlugin.js:456:10
at Hook.eval (eval at create (/poc-ckeditor/node_modules/tapable/lib/HookCodeFactory.js:19:10), <anonymous>:7:1)
at /poc-ckeditor/node_modules/webpack/lib/Compilation.js:5248:39
at tryRunOrWebpackError (poc-ckeditor/node_modules/webpack/lib/HookWebpackError.js:83:7)
at __webpack_require_module__ (/poc-ckeditor/node_modules/webpack/lib/Compilation.js:5246:12)
at __webpack_require__ (poc-ckeditor/node_modules/webpack/lib/Compilation.js:5203:18)
at poc-ckeditor/node_modules/webpack/lib/Compilation.js:5275:20
at symbolIterator (poc-ckeditor/node_modules/neo-async/async.js:3485:9)
at timesSync (/poc-ckeditor/node_modules/neo-async/async.js:2297:7)
at Object.eachLimit (poc-ckeditor/node_modules/neo-async/async.js:3463:5)
at poc-ckeditor/node_modules/webpack/lib/Compilation.js:5143:16
at symbolIterator (poc-ckeditor/node_modules/neo-async/async.js:3485:9)
at done (poc-ckeditor/node_modules/neo-async/async.js:3527:9)
at poc-ckeditor/node_modules/webpack/lib/Compilation.js:5057:8
at poc-ckeditor/node_modules/webpack/lib/Compilation.js:3498:5
at /poc-ckeditor/node_modules/webpack/lib/Cache.js:99:5
at Hook.eval [as callAsync] (eval at create (/poc-ckeditor/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:16:1)

If you'd like to see this fixed sooner, add a πŸ‘ reaction to this post.

filipsobol commented 1 week ago

This error message indicates that the problem is either with our styles (which require PostCSS) or with the webpack loader. Fortunately, very soon we will be releasing the new installation methods which may solve this problem as we will be shipping plain CSS (instead of PostCSS) and will not require any special Webpack setup and plugins.