Spliting lovelace code in UI mode (not in yaml mode)

Configuration Frontend
1

Hi everyone,

I find a lot of very interesting documentation for splitting the lovelace code into different files. But, it seems it’s only possible if you have lovelace in yaml mode.

Does anyone know if it can be split in UI mode?

I would hate to lose the ease of creating dashboards from the UI.

2

Splitting lovelace configuration in UI mode just doesn’t make sense.
What is bothering you?

3

It makes as much sense to me as in yaml mode.

For example, I want to have the views in different files to be able to share them with other dashboards.

I want to separate the decluttering_templates code into a file that can be shared between dashboards.

etc

4

My point is there are no “files” when using UI.
The configuration of those dashboards is buried in .storage as uneditable JSON files

5

I know, but you can’t reuse views or templates between dashboards. Everything has to be duplicated and you have more work to maintain it.

6

I get your point, but how would you envision reuse in a GUI?
That reuse aspect is one of the pro points of configuration as code, aka YAML.

You can’t really eat your cake and still have it, can you? :wink:

1 Like
7

What Chris is saying is it’s fundamentally different in gui mode. The things which make include work don’t even exist because all the yaml is condensed down to JSON and then stuffed in a database in gui mode - thus there’s no file to read in therefore include cannot work. It’s also the same reason you can’t embed comments.

If you want that you MUST use Yaml mode plain and simple.

8

Understood, I will put the pros and cons in a list and decide.

9

I had the same issue and now use both ways: One developing dashboard (UI-Mode) to be able to click the funktions and cards to what I want.
Then I copy that code to the main dashboard that is configured via yaml and quite modular.
My entries in configuration.yaml:

lovelace:
  mode: storage
  # Add yaml dashboards
  dashboards:
    lovelace-yaml:
      mode: yaml
      title: MainDashboard
      icon: mdi:account-group
      show_in_sidebar: true
      filename: main_dashboard.yaml
    nspanel-yaml:
      mode: yaml
      title: NSPanel
      icon: mdi:solar-panel
      show_in_sidebar: true
      filename: nspanel.yaml
1 Like
10

mmmm very interesting!

I understand that the “UI-Lovelace-Minimalist” is not necessary, right?

11

Yes, that is correct!

12

It’s just what I wanted, a mix of both modes.

Thank you very much.