pcbowers / alpine-intellisense

IntelliSense for Alpine.js
https://marketplace.visualstudio.com/items?itemName=pcbowers.alpine-intellisense
MIT License
19 stars 1 forks source link

Inspiration for personal project #2

Closed ivanjeremic closed 2 years ago

ivanjeremic commented 2 years ago

Hello and first of all thanks for this good extension, sorry for asking here in the issues but there is no discussion tab.

I want to extend .html too for a non alpinejs related project what I noticed when writing events with this extension there is not really an autocomplete for the javascript code written in the script tag, for example

<body>
    <script>
      function clickHandler() {
        console.log("boo");
      }
    </script>

    // the alpine click gives no autocomplete
    <div x-on:click="clickHandler()">Here</div>

    //the native onclick gives autocomplete for clickHandler
    <div onclick="clickHandler()">Here</div>
</body>

Is this supposed to work that way and if not is it possible to tell an custom attribute that everything between "..." should be javascript?

Again sorry for asking here but I'm currently really interested in solving this for me without creating a whole new language. Thanks

pcbowers commented 2 years ago

@ivanjeremic Good question! That, unfortunately, is not supposed to work. That is the difference between semantic highlighting and syntax highlighting. I would have to write my own language server to support semantic highlighting, which this plugin does not do.

Take a look at this repository to see how I get everything between the quotes to look like JavaScript though! It's basically using an injection TextMate grammar.

ivanjeremic commented 2 years ago

@ivanjeremic Good question! That, unfortunately, is not supposed to work. That is the difference between semantic highlighting and syntax highlighting. I would have to write my own language server to support semantic highlighting, which this plugin does not do.

Take a look at this repository to see how I get everything between the quotes to look like JavaScript though! It's basically using an injection TextMate grammar.

Thanks, yep that is perfect that everything looks at least like JavaScript I will take a deeper look at the codebase.

But currently only special attributes can look like JavaScript I wonder if with the method this plugin is build I can use an template identifier like VUE has but without to have to write a own language server. For example:

<div>{{ //everything inside here looks like JS }}</div>

?