javascriptcsswebpackmarko

How can i nest marko components in the file tree


i dont know how to access components that are nested in the components folder in my app's root index component. what i expected was that i can reference them via a nested html tag

i have a very solid functional react background and try to create my first marko widget.

index.marko

<div>
  <typography/headline />
  <typography/body />
</div>

the file tree:

src/
  index.marko
  components/
    typography/
      headline/
        index.marko
      body/
         index.marko
[...]

this does not work as the tag is unrecognized


Solution

  • Marko doesn't support nesting like this, so you'd need to do this instead:

    <div>
      <typography-headline />
      <typography-body />
    </div>
    
    src/
      index.marko
      components/
        typography-headline/
          index.marko
        typography-body/
          index.marko