Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

SVG loading issue with Vite #320

Open
Deutrix opened this issue Sep 27, 2024 · 3 comments
Open

SVG loading issue with Vite #320

Deutrix opened this issue Sep 27, 2024 · 3 comments
Labels
pending:feedback This issue is blocked by necessary feedback.

Comments

@Deutrix
Copy link

Deutrix commented Sep 27, 2024

I’m experiencing an issue with loading SVG defaultImport as raw in the custom build editor.

I'm using vite-svg-loader and it works as expected when set to 'raw'. However, I need to use a different loader for other purposes, and this is where the problem happens.

I attempted using vite-raw-plugin, but it didn’t resolve the issue. I'm receiving the following error when trying to toolbar with an SVG in CKEditor:

[id].vue:10 CKEditorError: Cannot read properties of null (reading 'getAttribute')
Read more: https://ckeditor.com/docs/ckeditor5/latest/support/error-codes.html#error-Cannot read properties of null (reading 'getAttribute')
    at _IconView._updateXMLContent (iconview.js:69:33)
    at _IconView.render (iconview.js:50:14)
    at _IconView.<anonymous> (observablemixin.js:181:45)
    at _IconView.fire (emittermixin.js:146:47)
    at <computed> [as render] (observablemixin.js:184:29)
    at ViewCollection._renderViewIntoCollectionParent (viewcollection.js:179:18)
    at ViewCollection.<anonymous> (viewcollection.js:63:18)
    at ViewCollection.fire (emittermixin.js:146:47)
    at ViewCollection.addMany (collection.js:106:18)
    at ViewCollection.add (collection.js:75:21)

It seems related to CKEditor’s handling of SVGs, particularly the getAttribute method failing or this.content.trim(). Is there any solution or workaround to load SVGs differently while keeping CKEditor functional?

Any help or suggestions would be appreciated!

@Witoso
Copy link
Member

Witoso commented Oct 3, 2024

Please share the information about the used version of the editor and integration packages.

@Witoso Witoso added the pending:feedback This issue is blocked by necessary feedback. label Oct 3, 2024
@Deutrix
Copy link
Author

Deutrix commented Oct 3, 2024

Using following versions:

"ckeditor5": "^43.0.0"
"@ckeditor/ckeditor5-vue": "^7.2.0"
"vite": "5.3.5" with "vite-svg-loader": "5.1.0"

@Witoso
Copy link
Member

Witoso commented Oct 14, 2024

I wonder it it's an SVG issue, CKEditor inlines all SVGs in the build process currently. Could you prepare a reproducible sample for us?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
pending:feedback This issue is blocked by necessary feedback.
Projects
None yet
Development

No branches or pull requests

2 participants