Ace: Vue.js single-file component support

[jimutt]

I would love to see support for files using different languages in the same file. Especially the single-component files you often use when working with Vue.js. See this picture for an example: http://vuejs.org/images/vue-component-with-pre-processors.png. For more information: http://vuejs.org/guide/application.html#Single_File_Components

There is a highlighting plugin for .vue files available for Sublime: https://github.com/vuejs/vue-syntax-highlight

[boustanihani]

any updates on this ?

[tremendus]

I agree. Is anyone following this? Can we import our own syntax highlighting using the sublime/atom syntax highlighters? this is the missing link from me using the product, as I work in Vue all day, love to figure out if it will become supported or if not where its something we can customize in the back door?

[wwq-sgxy]

I agree also.

[Piterden]

Me too

[boustanihani]

:+1:

[web812]

me too!!!

[ghost]

Agreed!

[asdred]

Will be awesome

[Piterden]

CodeMirror supports Vue @asdred

[boustanihani]

Any updates on this ?

[Piterden]

Ya, https://codemirror.net/

[boustanihani]

Is there a way to use CodeMirror inside Cloud9 ?

[Piterden]

If they don't want to implement vue syntax, maybe you should think about change it? Actually, they even not answering...

[boustanihani]

Very sad :( Vue is so popular and I am a premium user I. I hope this gets implemented soon.

[Piterden]

Well, happy waiting, thread started in Dec 14, 2015

[nightwing]

@boustanihani vue files seem to be simple html files with different extension, and cloud9 sets html extension for them by default https://github.com/c9/core/blob/master/node_modules/ace/lib/ace/ext/modelist.js#L94

Do you get a different mode, or does html mode not work as you are expecting?

[Piterden]

Does your HTML-mode support lang attributes in <template>, <script> and <style> tags?

[nightwing]

@Piterden, no, they support only html/js/css.
Id there a list of possible values for this lang attributes?

[boustanihani]

Code formatting is not working inside the <template> and the <style> tags.

[nightwing]

@boustanihani, code formatting is not related to this issue, since you are a premium customer, please open a support ticket, and show examples of files for which code formatting does not work as expected, this issue is about syntax highlighting.

[boustanihani]

I already did this month ago

[Piterden]

Here is the list, @nightwing :

https://github.com/vuejs/vue-syntax-highlight/blob/master/vue.YAML-tmLanguage#L67
https://github.com/vuejs/vue-syntax-highlight/blob/master/vue.YAML-tmLanguage#L83
https://github.com/vuejs/vue-syntax-highlight/blob/master/vue.YAML-tmLanguage#L99
https://github.com/vuejs/vue-syntax-highlight/blob/master/vue.YAML-tmLanguage#L116
https://github.com/vuejs/vue-syntax-highlight/blob/master/vue.YAML-tmLanguage#L132
https://github.com/vuejs/vue-syntax-highlight/blob/master/vue.YAML-tmLanguage#L148
https://github.com/vuejs/vue-syntax-highlight/blob/master/vue.YAML-tmLanguage#L165
https://github.com/vuejs/vue-syntax-highlight/blob/master/vue.YAML-tmLanguage#L183
https://github.com/vuejs/vue-syntax-highlight/blob/master/vue.YAML-tmLanguage#L215
https://github.com/vuejs/vue-syntax-highlight/blob/master/vue.YAML-tmLanguage#L233
https://github.com/vuejs/vue-syntax-highlight/blob/master/vue.YAML-tmLanguage#L251

[nightwing]

@Piterden thanks, i am working on a update for syntax highlighter, which will make embedding languages easy, it will be ready in about 2 weeks.

@boustanihani i am sorry, i am not able to find anything related to your report. And as for as i can see code formatting works now for basic things, so there must be a subtler issue.

[Piterden]

@nightwing If it would be opensource, then there is a big chance we go back from CM :wink:

[BeauAgst]

Any update on this?

[o-alexandrov]

😅

Q: I need to have syntax highlighting for Pug and Stylus in .vue files
A: How about using HTML instead? I heard it's good enough for basic tasks...