Replace Vue Grammar

[yuichkun]

This PR replaces the Vue.js grammar vendor from vuejs/vue-syntax-highlight to vuejs/language-tools. The grammar file is located at https://github.com/vuejs/language-tools/blob/master/extensions/vscode/syntaxes/vue.tmLanguage.json

Description

Background: There have been some issues stating that Vue's syntax breaks when certain newly introduced TypeScript syntax are present, such as optional chaining operator (?).

Related Issues:

• https://github.com/github-linguist/linguist/issues/6001
• https://github.com/vuejs/vue-syntax-highlight/issues/217

Fix:

Since vuejs/vue-syntax-highlight has long been not updated (last commit is 4 years ago), and also there's even a collaborator of vuejs/language-tools suggesting linguist should switch Vue's grammar vendor to vuejs/language-tools (see this comment), here's the PR.

I'm not exactly sure if this really fixes all the problems, but I followed the CONTRIBUTING.md and just ran the following:

./script/add-grammar --replace vue-syntax-highlight https://github.com/vuejs/language-tools/blob/mast
er/extensions/vscode/syntaxes/vue.tmLanguage.json

In the script log, I found the following warnings:

5 warnings found when compiling new grammar 'repository `vendor/grammars/language-tools` (from https://github.com/vuejs/language-tools.git)':
- Unknown keys in grammar: `source.vue` (in `extensions/vscode/syntaxes/vue.tmLanguage.json`) contains invalid keys (`Repository[vue-directives-original].Patterns[0].1`, `Repository[vue-directives-original].Patterns[0].2`)
- Missing include in grammar: `source.vue` (in `extensions/vscode/syntaxes/vue.tmLanguage.json`) attempts to include `source.js.jsx` but the scope cannot be found
- Missing include in grammar: `source.vue` (in `extensions/vscode/syntaxes/vue.tmLanguage.json`) attempts to include `source.json.comments` but the scope cannot be found
- Missing include in grammar: `source.vue` (in `extensions/vscode/syntaxes/vue.tmLanguage.json`) attempts to include `source.json5` but the scope cannot be found
- Missing include in grammar: `source.vue` (in `extensions/vscode/syntaxes/vue.tmLanguage.json`) attempts to include `text.html.derivative` but the scope cannot be found

These warnings are not fatal, but may mean the syntax highlighting on GitHub.com may not be as expected.

Is this fine?

Checklist:

• [x] I am changing the source of a syntax highlighting grammar
  • Old: https://github.com/vuejs/vue-syntax-highlight
  • New: https://github.com/vuejs/language-tools

[lildude]

Is this fine?

It's fine in as much as Linguist and the syntax highlighter don't care. It might not be fine for users as these messages indicate that those particular scopes can't be found so the rules from them won't be applied when highlighting a file.

[yuichkun]

@lildude

The CI was failing with the following error:

  1) Failure:
TestLanguage#test_all_languages_have_grammars [test/test_language.rb:361]:
The following languages' scopes are not listed in grammars.yml. Please add grammars for all new languages.
If no grammar exists for a language, mark the language with `tm_scope: none` in lib/linguist/languages.yml.
Vue text.html.vue

And I assumed that I have to set tm_scope to source.vue in lib/linguist/languages.yml, so that it corresponds to the scope name specified in the new repo here. So I fixed it so in https://github.com/github-linguist/linguist/pull/7086/commits/ecb907d62fb52abecc3f097ae8862117d128b72a

Am I in the right direction?

Thank you for taking your time to review

[lildude]

Am I in the right direction?

Yup. That's the right thing to do.