I am trying to build an ember 3.25 application that imports the CkEditor
via ember-auto-import
I was able to get the editor working fine by adding the following to my package.json
:
"@ckeditor/ckeditor5-build-classic": "^27.0.0",
and adding the following to my ember component:
import ClassicEditor from '@ckeditor/ckeditor5-build-classic';
...
didInsertElement() {
var editor = ClassicEditor
.create( document.querySelector( '#editor' ), {
...
});
}
But when I tried to add the ImageResize
module via:
"@ckeditor/ckeditor5-image": "^27.0.0",
and in my component (as instructed here):
import Image from '@ckeditor/ckeditor5-image/src/image';
import ImageResize from '@ckeditor/ckeditor5-image/src/image-resize';
I was initially seeing errors that read: 'UnhandledPromiseRejectionWarning: Error: webpack returned errors to ember-auto-import
so I ran AUTO_IMPORT_VERBOSE=true ember serve
I now am seeing errors that ckeditor can't @import
nested .css
:
ERROR in ./node_modules/@ckeditor/ckeditor5-ui/theme/components/toolbar/toolbar.css 6:0
Module parse failed: Unexpected character '@' (6:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
| */
|
> @import "../../mixins/_unselectable.css";
Or use ES6 syntax:
ERROR in ./node_modules/@ckeditor/ckeditor5-ui/theme/components/dropdown/toolbardropdown.css 6:0
Module parse failed: Unexpected token (6:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
| */
|
> :root {
and errors where it tries to include svg files:
ERROR in ./node_modules/@ckeditor/ckeditor5-widget/theme/icons/drag-handle.svg 1:0
Module parse failed: Unexpected token (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> <svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><path d="M4 0v1H1v3H0V.5A.5.5 0 0 1 .5 0H4zm8 0h3.5a.5.5 0 0 1 .5.5V4h-1V1h-3V0zM4 16H.5a.5.5 0 0 1-.5-.5V12h1v3h3v1zm8 0v-1h3v-3h1v3.5a.5.5 0
0 1-.5.5H12z"/><path fill-opacity=".256" d="M1 1h14v14H1z"/><g class="ck-icon__selected-indicator"><path d="M7 0h2v1H7V0zM0 7h1v2H0V7zm15 0h1v2h-1V7zm-8 8h2v1H7v-1z"/><path fill-opacity=".254" d="M1 1h14
v14H1z"/></g></svg>
Based on this message:
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
It seems like I need to add some webpack loaders to ember, but I'm really not sure how to do that. Can anyone help?
Aucun commentaire:
Enregistrer un commentaire