Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'styleMap') at #k (xel.js:1:51212) about xel HOT 3 CLOSED

The problem is caused by this line:

<meta name="xel-theme" content="node_modules/xel/themes/adwaita.css">

Are you sure that the path node_modules/xel/themes/adwaita.css is actually accessible? Please also try moving <script src="node_modules/xel/xel.js" type="module"></script> below all <meta> tags.

from xel.

Yes, you are literally right about this. It is the path issue that caused these errors.
But there are some problems that confused me a lot.
I moved the line <script src="node_modules/xel/xel.js" type="module"></script> below all <meta> tags. It still won't work.
After I did following steps below, I found something so weird.

Solution1

The css is applied in the page properly. But the warnings still exsit.

Solution2

The css is applied in the page properly as well. But the warnings still exsit.

Warnings

[Vue warn]: Failed to resolve component: x-icon
If this is a native custom element, make sure to exclude it from component resolution via compilerOptions.isCustomElement. 
  at <BookMarkTable> 
  at <App>

I guess it might be associated with the compatibility of Vue3. Is there any solution to get rid of these warnings?

What confused me

I have figured it out it is the path problem that caused these errors above. Then, why would some resources, like .svg and .js files be accessible? Why .css files not?

Thanks a lot.

from xel.

I have never used Vue so I'm afraid I can't help you to get rid of these warnings. You seem to be using some preprocessor to compile main.js, but I have no idea what logic is used to resolve relative URLs.

from xel.