Custom-element doesn't exist

The only thing I see right off the top of my head is your indentation is off in the code you posted. Check to make sure it’s correct in your actual config.

It definitely has to be in configuration.yaml not in ui-lovelace.yaml

1 Like

Did you ever get it working? I’ve got a number of cards installed via HACS that are in the /www/community/ folder as expected. However when I add the resources via the Lovelace configuration, the cards still don’t work after restarting and refreshing the browser. Any other missing steps to get custom cards working?

I’ve followed the instructions carefully from all the different custom cards, it sure seems like I’ve done every step. I had custom cards working fine via HACS on my older version on RPi3, but when I upgraded my system, I wanted to start fresh because a lot of things had gotten messy during my learning.

1 Like

How do you add the resource to the configuration? Do you copy it from the HACS screen and then paste it into your editor?
I did that always and after I don’t know how many tries, I realised that there were some tabs and other characters that you cannot see included in the copy - it all looked fine but it screwed the resource information. So I deleted all space characters in the resource definition and added manual spaces:

e.g. after I have retyped the spaces in below it worked … at least worth giving it a try but I cannot guarantee :wink:

- url: /hacsfiles/dual-gauge-card/dual-gauge-card.js
  type: module

I am in the exact same boat as you. It seems like everything has been done correctly but home assistant can not find the custom elements.

2 Likes

Same here :frowning: Has anyone found a solution already ?

2 Likes

+1

meaning have the same issues after reinstalling a full Image of my HA instance on a new machine.

Update: Ok, I was not aware of that change on how to add the configuration. So maybe this helps someone else: Check this comment here: Solved: How do I add custom cards for lovelace?

Hi there all,
it’s some weeks that I have same problem in my Hass.
Before everything was ok.

But now I have this error too:

I use Lovelace in YAML mode and my ui-lovelace.yaml conf it’s begin like this:

# Enable lovelace User Interface
lovelace:
  mode: yaml
  resources:
    - url: /hacsfiles/weather-card/weather-card.js
      type: module
#
    - url: /hacsfiles/mini-graph-card/mini-graph-card-bundle.js
      type: module
#
    - url: /hacsfiles/bignumber-card/bignumber-card.js
      type: module
#
  ### card-mod - https://github.com/thomasloven/lovelace-card-mod
    - url: /hacsfiles/lovelace-card-mod/card-mod.js
      type: module
#
  ### kiosk-mode - https://github.com/maykar/kiosk-mode (sa nu se vada meniurile din hassio)
    - url: /hacsfiles/kiosk-mode/kiosk-mode.js
      type: module
#
  ### lovelace-layout-card - https://github.com/thomasloven/lovelace-layout-card
    - url: /hacsfiles/lovelace-layout-card/layout-card.js
      type: module
#
  ### font dscarcat de mine
    - url: /local/fonts/loadfonts.js
      type: module
#
  ### font che serve per thema 
    - url: https://fonts.googleapis.com/css?family=Comfortaa&display=swap
      type: css
####################################################################################

### userul tablet nu vede meniurile in hassio 
kiosk_mode:
  non_admin_settings:
    hide_header: true
    hide_sidebar: true

#title: Home
views:
#-----------------------------------------------------------------------------------
#-----------------------------------------------------------------------------------
  - title: Home
    icon: 'mdi:home'
#    background: 'center / cover no-repeat url("/local/background.jpeg") fixed'
    cards:
      - type: vertical-stack
        cards:
          - type: 'custom:bignumber-card'
            entity: sensor.time
            scale: 50px
...etc

My structure folder is like this:
image

Was always work… is there something change in Lovelace configuration in last time please ?

Thanks in advance
Denis

Is HACS running? Have you cleared cache?

2 Likes

My HACS is like this:

I don’t know how to understand if it’s running.
I have clear all cookies/cache and I have test it also with Firefox and on my mobile phone.

Thanks a lot for you answer
Denis

Do you see any errors in the browser console? Press F12 in chrome for dev tools and while you are there right click on the refresh button and select clear cache and hard reload and then CTRL+R a couple of times. The error you show is either HACS isn’t running (/hacsfiles/ endpoint doesnt exist therefore no card found) or cache is caching old cards.
Can you confirm hacs installed cards in /www/community/card-name’directory?

2 Likes

I have selected more times clear cache and hard reload and the result is the same.
Also I have no errors on the console… is empty:

My hacsfiles is here in the config folder:
image

Another think I want to remember is that this configuration was worked for a lot of time.
It’s just a couple of weeks that I take this error.

Thanks a lot again
Denis

Doesn’t make any sense. This is always cache.

1 Like

I have tested also with my mobile phone… same error.

I note that if I click on the menu in the HACS page I finally have some warnings in the console:

Can this help a little ?

Thanks again
Denis

This goes in configuration.yaml, not ui-lovelace.yaml

3 Likes

Whoauuuu… finally it’s work :slight_smile:

Anyway… this is only from some weeks ago I’m sure.
Because this configuration was worked more than 2 years.

Thanks a lot all for the help.
Denis

1 Like

that explanation I was searching for to keep the folders clear and separated especially the hacs versus custom_components folder

thx

Having problems as well, this was the clue for me, thanks!

I’ve had this custom clock integration working for a while, but last week I started getting the Lovelace card error “Custom element doesn’t exist: htc-weather-card". I don’t believe the integration is the problem rather something with my HA.

What’s super-odd is even when I restore a complete backup, it’s no longer working on any of my home devices. What’s even weirder is that at my office (desktop, Windows, Chrome) and my Android phone app, it works. But when at home, this card is broken on every device, including my phone.

Of course I’ve cleared the cache numerous times. Also tried internet URL rather than my local (not that it should make any difference). Through Lovelace/Edit Dashboard/Manage resources I have the JS Module /local/custom_ui/htc-weather/htc-flipclock-weather.js?v1.3.2 which is a newer version but like I said, even when I restore & have the old JS version, still getting the error.

EDIT: Okay, after nearly a week of dealing with this, miraculously (just after this post of course), the integration card started working. I had done nothing since the post, so who knows…

I have an issue with a few cards that says they dont exist. I clear the cache on my computer or my iphone. and all looks fine, but the a couple hours or sometimes a day it will say it doesnt exist again. Almost like its reveting back to before I cleared my cache.

HOW IS THIS POSSIBLE? Ive asked 100 times in this forum, and no one has an answer or a suggestion yet.

1 Like