Adding a YAML dashboard breaks all others

[flint depot]

Need some advice here.
I have some basic dashboards. Since I mostly suck at everything that is design, I focused on getting automations and integrations working in the past weeks.
Also I created some dashboards, but nothing too fancy.

Now its time to create something beautiful with a higher WAF.

I'm looking into HaCasa. But everytime I add the dashboard to the configuration.yaml, it breaks all other existing dashboards. It looks like by including ressources for the YAML dashboard, those become unavailable for the other dashboards (or are double-loaded and break, or whatever).

This is what I do in my configuration.yaml:

`lovelace:
mode: "yaml"
resources:

• url: "/hacsfiles/button-card/button-card.js"
  type: "module"
• url: "/hacsfiles/my-cards/my-cards.js"
  type: "module"
• url: "/hacsfiles/lovelace-card-mod/card-mod.js"
  type: module
• url: "/hacsfiles/mini-graph-card/mini-graph-card-bundle.js"
  type: module
• url: "https://fonts.googleapis.com/css2?family=Montserrat:wght@100;200;300;400;500;600;700;800;900"
  type: css
• url: /hacsfiles/sidebar-card/sidebar-card.js
  type: module
  dashboards:
  hacasa-dashboard:
  mode: "yaml"
  title: HaCasa
  icon: mdi:home
  show_in_sidebar: true
  filename: "dashboard/HaCasa/main.yaml"`

If I do that, all my other dashboards stop working, if custom cards, elements, etc. are used. I.e. "custom element doesn't exist: grid-layout."

[sullen sorrel]

It may just be what you posted here, but resources should aligned with "mode" and dashboards also aligned with "mode". Sorry, don't know anything about Hacasa, but I have numerous dashboards in both yaml and also the gui created ones, they work and play together fine.

[strong wadi]

Just wondering why you've added all of the resources manually? Are you not using HACS to install? If you are, you don't need to add all of that; HACS takes care of it about 98% of the time.

You said your code breaks other dashboards. I'm assuming you mean the UI-created dashboards. Your code is configured for YAML only. When you want to use UI-created (storage mode) and YAML-based, the mode (line 2) needs to be storage, but still have the yaml dashboard defined like you do.
You can read more about it here: Adding more dashboards with YAML

You can also add YAML dashboards when your main dashboard is UI configured:

lovelace:
  mode: storage
  # Add yaml dashboards
  dashboards:
    lovelace-yaml:
      mode: yaml
      title: YAML
      icon: mdi:script
      show_in_sidebar: true
      filename: dashboards.yaml```

[flint depot]

Thanks for the hints, I will have a closer look at it. I added them manually, because this is how it was defined in the HaCasa documentation.

You are right, I have some normal GUI dashboards. And I am experimenting with some YAML dashboards next to that.

[red patrol]

Have you tried setting Lovelace mode to storage and not yaml ?

[flint depot]

Yes, after reading through the comments above, that seemed to have been it. Thanks everyone!

[strong wadi]

If everything is working like it should, I'd recommend revisiting the resources. I believe the way you have it now, you won't be able to get updates for the custom stuff unless you do it manually.
You should be able to go back to HACS, install custom-button card, for example, and then comment out those lines shown above. Just for good measure, do a full reboot and clear caches. If all is well, you can remove the commented lines and install the rest of them.
Looking at the docs for HaCasa, the Dev stays:

These are all Lovelace Resources and can be downloaded through HACS or manually, but again, check their documentations.
But then later doesn't mention setting it up if you did install via HACS.

And, FYI, Bubble Card gets frequent updates.