Syntax highlighting for `@event=` attributes not working on Laravel Blade files

[farmerpaul]

This extension doesn't seem to be working with the Laravel Blade file type for VS Code. I use the extension shown below to highlight the rest of my Blade files, and I was hoping alpinejs-syntax-highlight would highlight all my AlpineJS attributes as well, but no dice. Is there a way I can add Blade files to its list of recognized file types?

Edit: There is an issue with highlighting Alpine code in Blade files – it doesn't seem to work on the @event= attribute format.

Name: Laravel Blade Snippets
Id: onecentlin.laravel-blade
Description: Laravel blade snippets and syntax highlight support
Version: 1.32.0
Publisher: Winnie Lin
VS Marketplace Link: https://marketplace.visualstudio.com/items?itemName=onecentlin.laravel-blade

[Sperovita]

Adding new file types is fairly simple.

They're added here. Those entries are textmate scopes. You can see those by adding a keybind to vs codes keybinds.json.

{
    "key": "ctrl+alt+shift+i",
    "command": "editor.action.inspectTMScopes"
}

Can use whatever key you want, though that will show the textmate scopes, when used in the desired file, to add to injectTo.

You would need to also add the textmate scope here

Since it's setup to work on php files it seems to work in blade.php in my test. Albeit if you put blade syntax inside of an x attribute it's syntax highlighting is a bit off with my current extensions. It still separates tokens for the most part though, even if it is off from what it looks like outside of an x attribute.

The main issue I see with the Laravel Blade Snippets compatibility is the @ shorthand for x-on:. It seems to be due to that extension changing the scope on @something= like in the example above. It's done here in their extension. Removing that actually makes my extension work, though breaks some of their functionality of course.

I'm no expert on texmate syntax files, mines based a lot off of vueter's and some vs code docs on it. There may be some improvements on my implementation that could allow me to override the Laravel Blade Snippet scope change. I've tried a few things with no luck so far.

Alternative workaround for now would be to use the x-on: instead of @. Albeit that's not ideal to change your code base for highlighting. I personally prefer the shorthand.

If you're having issues with x- attributes too, maybe send a snippet, screenshot and/or the file extension for your blade files.

I'll keep looking into @ issue, though it may take a bit.

[farmerpaul]

Hey @Sperovita, thanks for looking into that so quickly and thoroughly and sending me all that info. It turns out it was just the @event syntax that wasn't working, I guess I'd just done a very cursory check in a file where that was the only type of attribute used. I should have done a little more testing ahead of time!

So I agree, I'd prefer not to have to change my code to switch to x-on syntax everywhere. I'll modify the ticket title accordingly. I understand if it'll take you some time! Thanks again.