8uff3r/vue-ts-mode

Emacs major mode for Vue based on Tree-sitter

vue-ts-mode's Issues

Inexplicable hanging when opening a certain vue file?

Okay, I've spent hours trying to figure this out and I'm at my wits' end. I would be surprised if this turns out to be a real bug and not something specific to my setup. If you simply tell me whether you're able to reproduce, I would be grateful.

When I attempt to open the following file with vue-ts-mode turned on, emacs hangs indefinitely and pegs the CPU at 100%:.

<template>
  <div v-if="agreementType1">
            <base-form-row>
              <base-input ref="cashPrice" name="cash_price" />
              <template v-if="!agreementType.recurring_billing">
                <base-input name="sales_tax_rate" />
                <base-input name="sales_tax_amount" />
              </template>
            </base-form-row>
            <base-form-row>
              <base-input name="down_payment" />
              <base-input name="financed_amount" />
              <base-input name="total_balance_due" />
            </base-form-row>
            <base-form-row>
              <base-input name="billing_cycle" />
              <base-input name="number_of_payments" />
            </base-form-row>
            <base-form-row>
              <base-input name="finance_rate_percent" />
              <base-input name="finance_charge" />
              <base-input name="apr" :show-errors="true">
                <template slot="errors" slot-scope="{ field, validation, isActive }">
                  <p v-if="validat"></p>
                </template>
              </base-input>
            </base-form-row>
  </div>
</template>

The strange indenting is intentional.

Any one of the following changes gets rid of the hanging:

1. Editing vue-ts-mode.el as follows:

diff --git a/vue-ts-mode.el b/vue-ts-mode.el
index 69faeb8..0cd495d 100644
--- a/vue-ts-mode.el
+++ b/vue-ts-mode.el
@@ -154,9 +154,9 @@
 
      (interpolation (raw_text) @capture)
 
-     (element (_ (directive_attribute
-                  (quoted_attribute_value
-                   (attribute_value) @capture)))))
+     (directive_attribute
+      (quoted_attribute_value
+       (attribute_value) @capture)))
 
    :embed 'css
    :host 'vue

2. Or, editing the file in question as follows:

24c24
<                   <p v-if="validate"></p>
---
>                   <p v-if="validat"></p>

Yes, that's removing the "e".

3. Or, making just about any other change to the file in question, including reducing the indentation of the over-indented middle section by one space.

The tree-sitter cli successfully parses the file in question.

Here's how I've installed vue-ts-mode:

(use-package vue-ts-mode
  :mode "\\.vue\\'"
  :load-path ("site-lisp/vue-ts-mode"))

emacs 29.2
tree-sitter 0.20.8
https://github.com/8uff3r/vue-ts-mode @ 157476c
https://github.com/ikatyang/tree-sitter-vue @ 91fe275
https://github.com/tree-sitter/tree-sitter-typescript @ d847898
https://github.com/tree-sitter/tree-sitter-css @ 98c7b3d
https://github.com/tree-sitter/tree-sitter-html @ 949b780

Pug Support?

Hello! Firstly, thank you for this awesome mode. I am currently building an emacs config and moving away from neovim, so I don't know much about this stuff yet, but is there a way to get <template lang="pug"></template> contents to highlight according to pug mode?