2.0.3 Removes Highlighting in Vue SFCs

[greyscaled]

Problem

After package control upgraded this package, my Vue single file components no longer have syntax highlighting:

Expected Results

Sass syntax highlighting in Vue SFCs where the following is defined:

<style lang="scss">
</style>

Prior to this release, things were working as expected.

Environment

• Sublime 3.1.1, Build 3176
• SublimeSass v2.0.3
• Vue Syntax Highlight v3.3.1

[michaelblyons]

This line needs to match the scope of the SCSS package you use. Braver's is set to source.css.scss.

[greyscaled]

@braver I was reading wbond/package_control_channel#7220 and if I interpreted it correctly, it seems that your version of this package only recently got pushed to package control as of a few hours ago?

If true, I take it that prior commits to this repository were not rolling out to those who installed via package control.

8fbbb95 introduced the change mentioned by @michaelblyons

Would it make sense to change the scope back to source.scss ? I'm not sure what implications that would have, but I don't see how I can integrate with vue-syntax-highlight otherwise, unless I'm missing something. It doesn't seem possible for me to configure these scopes once the packages are downloaded/installed from package control.

File:
https://github.com/braver/SublimeSass/blob/2d12d9e9aab91f542394c7dfe5ec4959d81e2f0b/Syntaxes/SCSS.sublime-syntax#L7

[hiendv]

Okay. So basically this is the new Sass package from the package control.
For Vue.js forks

• Temporary workaround: Remove Sass package and install Syntax Highlighting for Sass
• Wait for vuejs/vue-syntax-highlight to fix this

[braver]

@vapurrmaid yes, after some back and forth we decided to replace the old Syntax Highlighting for Sass repository with mine as the source for the Sass package. Before that change some people were already using the new package via manual installation, but it hasn't been rolled out via package control yet. As you saw in the commit you linked, it's now built on the same principles as the LESS package that's already available via package control.

Would it make sense to change the scope back to source.scss

Well yes and no. The same change has been made to the vue syntax to support LESS, so that's the proper way to solve this.

Right now both LESS and SCSS are scoped to present themselves as an extension of the CSS syntax. This way they get to inherit things like keybindings and completions.

That said, at some point I probably want to extend the CSS completions in a smarter way. The fact that normal CSS of course isn't nested, sometimes makes it a bit tricky to not trigger keybindings and completions at the incorrect time. So, it might change back at some point. Who knows. :)

It doesn't seem possible for me to configure these scopes once the packages are downloaded/installed from package control.

Scopes aren't configurable, but packages can be hacked.

Wait for vuejs/vue-syntax-highlight to fix this

Sublime needs a better syntax for Vue, and it needs one that is maintained more actively. But they do tend to respond to PR's, so that might help push this forward. I'll have to see how my priorities lie the coming weeks.

[skyronic]

Hey folks!

Maintainer of Vue.js sublime syntax here. Pushed out a new release including @louim's fix, can you check it out (v3.3.2) and let me know if it's fixed now?

Thank you!

[greyscaled]

Fixed by vuejs/vue-syntax-highlight#163