Add syntax Highlighing extension to Sublime for Vue

If like me, you have never added an package to Sublime previously then first you have to add a package manager to your Sublime.

1, Go to the toolbar of you Sublime
Click on: View/Show Console
Go to:
https://packagecontrol.io/installation
I have Sublime Text 3 so I added this code to the console and pressed enter.

import urllib.request,os,hashlib; h = '6f4c264a24d933ce70df5dedcf1dcaee' + 'ebe013ee18cced0ef93d5f746d80ef60'; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); by = urllib.request.urlopen( 'http://packagecontrol.io/' + pf.replace(' ', '%20')).read(); dh = hashlib.sha256(by).hexdigest(); print('Error validating download (got %s instead of %s), please try manual install' % (dh, h)) if dh != h else open(os.path.join( ipp, pf), 'wb' ).write(by)

2, Once you do that for your version of Sublime go to
Preferences in your Sublime Toolbar and you'll see a new option:
Preferences/Package Control
Click on that and you will get a pop-up menu.
3. Just type in the thing you are looking for and click on it.

I used Vue Syntax Highlight (I picked it randomly)

This is what my Preferences/Package Settings/Package Control/Settings-Default looks like after I added it.

{
"bootstrapped": true,
"in_process_packages":
[
],
"installed_packages":
[
"Package Control",
"Vue Syntax Highlight"

}

Voila! Now my Vue files are beautiful and have useful highlighting.