Question: Consuming in another tree-sitter grammar

[mhartington]

👋 Hey there, I'm working on a tree-sitter grammar for Analog.js, which is a meta-framework on top of Angular.

Analog offers a single file component syntax via the .angalog filetype, which ends up being very similar to Vue, but still uses Angular's template syntax in a template block.

<script lang="ts">
  import { signal } from '@angular/core';

  const count = signal(0);

  function increment() {
    count.update(total => ++total);
  }
</script>

<template>
  <h2>Hello Analog</h2>

  @if(count()){
    Count: {{ count() }}
  }
  <button (click)="increment()">
    Increment
  </button>
</template>

<style>
  h2 {
    color: red;
  }
</style>

I'm currently trying to integrate this tree-sitter grammar as it can provide all the new control flow syntax, but a bit lost in how this should be done effectively.

Extending it in grammar.js creates a parsing error in the final document, but trying to grab the whole template-element doesn't seem to allow for injecting angular.html on the template segment.

[dlvandenberg]

I think you should inject the angular parser on the template node in a plugin like nvim-treesitter. For example, you can take a look at the injections for typescript. The angular parser is injected on the template part. Or better, you can look at how it is done for vue