├── .gitignore
├── .vscode
    └── launch.json
├── .vscodeignore
├── LICENSE
├── README.md
├── images
    ├── screenshot.png
    └── vuejs-logo.png
├── package.json
├── snippets
    └── snippets.json
├── syntaxes
    └── vue.tmLanguage.json
├── vsc-extension-quickstart.md
└── vue.configuration.json


/.gitignore:
--------------------------------------------------------------------------------
1 | *.vsix


--------------------------------------------------------------------------------
/.vscode/launch.json:
--------------------------------------------------------------------------------
 1 | // A launch configuration that compiles the extension and then opens it inside a new window
 2 | {
 3 | 	"version": "0.1.0",
 4 | 	"configurations": [
 5 | 		{
 6 | 			"name": "Launch Extension",
 7 | 			"type": "extensionHost",
 8 | 			"request": "launch",
 9 | 			"runtimeExecutable": "${execPath}",
10 | 			"args": ["--extensionDevelopmentPath=${workspaceRoot}" ]
11 | 		}
12 | 	]
13 | }


--------------------------------------------------------------------------------
/.vscodeignore:
--------------------------------------------------------------------------------
1 | .vscode/**
2 | .gitignore
3 | vsc-extension-quickstart.md


--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
 1 | The MIT License (MIT)
 2 | 
 3 | Copyright (c) 2015 Liu Ji
 4 | 
 5 | Permission is hereby granted, free of charge, to any person obtaining a copy
 6 | of this software and associated documentation files (the "Software"), to deal
 7 | in the Software without restriction, including without limitation the rights
 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
 9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 | 
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 | 
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 | 
23 | 


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
 1 | # vscode-vue
 2 | Syntax Highlight for Vue.js
 3 | 
 4 | ## Oops
 5 | 
 6 | Sorry for the bad news: ES2015 support is still buggy.
 7 | 
 8 | When using embeded `<script>` JavaScript code **can not** trigger VSC's JavaScript language support. That means Intellisense won't work with embeded `<script>` tags.
 9 | 
10 | So using ES2015 may cause the syntax highlighting broke **below** the `<script>` tag when using some new ES2015 syntaxes (E.G. `export default`).
11 | 
12 | I'm still working on how to make VSC to enable full-featured JavaScript language support.
13 | 
14 | For now, if you want to activate the syntax highlighting, you can move the `<style>` tag **above** the `<script>` tag in `.vue` files. But you still can't get full-featured JavaScript language support, including Intellisense.
15 | 
16 | Visual Studio Code
17 | 
18 | ## Install
19 | 
20 | `ext install` in Visual Studio Code command line
21 | 
22 | Search for `vue` and click install
23 | 
24 | ## Screenshots
25 | 
26 | ![vue-loader-example](./images/screenshot.png)
27 | 
28 | ## Code Snippets
29 | 
30 | |trigger|snippet|
31 | |-------|-------|
32 | |`vud-cdn`|`<script>` tag to cdnjs|
33 | |`add`|`vm.$add`|
34 | |`delete`|`vm.$delete`|
35 | |`eval`|`vm.$eval`|
36 | |`set`|`vm.$set`|
37 | |`get`|`vm.$get`|
38 | |`ipo`|`vm.$interpolate`|
39 | |`log`|`vm.$log`|
40 | |`wat`|`vm.$watch`|
41 | |`vue`|`new Vue`|
42 | |`vue-config`|`Vue.config`|
43 | |`vue-dir`|`Vue.directive`|
44 | |`vue-extend`|`Vue.extend`|
45 | |`vue-filter`|`Vue.filter`|
46 | |`v`|`an empty object`|
47 | 


--------------------------------------------------------------------------------
/images/screenshot.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/LiuJi-Jim/vscode-vue/067f046f61b080c9b20a2d965a43043f651badb8/images/screenshot.png


--------------------------------------------------------------------------------
/images/vuejs-logo.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/LiuJi-Jim/vscode-vue/067f046f61b080c9b20a2d965a43043f651badb8/images/vuejs-logo.png


--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 | 	"name": "vue",
 3 | 	"description": "Syntax Highlight for Vue.js",
 4 | 	"version": "0.1.5",
 5 | 	"author": "liuji-jim",
 6 | 	"publisher": "liuji-jim",
 7 | 	"icon": "images/vuejs-logo.png",
 8 | 	"keywords": [
 9 | 		"vue",
10 | 		"vuejs",
11 | 		"vue.js"
12 | 	],
13 | 	"engines": {
14 | 		"vscode": "^0.10.1"
15 | 	},
16 | 	"repository": {
17 | 		"type": "git",
18 | 		"url": "https://github.com/LiuJi-Jim/vscode-vue.git"
19 | 	},
20 | 	"categories": [
21 | 		"Languages"
22 | 	],
23 | 	"contributes": {
24 | 		"languages": [{
25 | 			"id": "vue",
26 | 			"aliases": ["Vue.js", "vue"],
27 | 			"extensions": [".vue"],
28 | 			"configuration": "./vue.configuration.json"
29 | 		}],
30 | 		"grammars": [{
31 | 			"language": "vue",
32 | 			"scopeName": "text.html.vue",
33 | 			"path": "./syntaxes/vue.tmLanguage.json"
34 | 		}],
35 | 		"snippets": [{
36 | 			"language": "vue",
37 | 			"path": "./snippets/snippets.json"
38 | 		}]
39 | 	},
40 | 	"license": "MIT"
41 | }


--------------------------------------------------------------------------------
/snippets/snippets.json:
--------------------------------------------------------------------------------
 1 | {
 2 | 	"add": {
 3 | 		"prefix": "add",
 4 | 		"body": "${1:vm}.$add(${2:key}, ${3:value})\n",
 5 | 		"description": "",
 6 | 		"scope": "source.js"
 7 | 	},
 8 | 	"vue-cdn": {
 9 | 		"prefix": "vue-cdn",
10 | 		"body": "<script src=\"http://cdnjs.cloudflare.com/ajax/libs/vue/1.0.13/vue.min.js\"></script>\n",
11 | 		"description": "",
12 | 		"scope": "text.html"
13 | 	},
14 | 	"delete": {
15 | 		"prefix": "delete",
16 | 		"body": "${1:vm}.$delete(${2:key})\n",
17 | 		"description": "",
18 | 		"scope": "source.js"
19 | 	},
20 | 	"eval": {
21 | 		"prefix": "eval",
22 | 		"body": "${1:vm}.$eval(${2:msg} | ${3:uppercase})\n",
23 | 		"description": "",
24 | 		"scope": "source.js"
25 | 	},
26 | 	"set": {
27 | 		"prefix": "set",
28 | 		"body": "${1:vm}.$set(${2:expression}, ${3:value})\n",
29 | 		"description": "",
30 | 		"scope": "source.js"
31 | 	},
32 | 	"get": {
33 | 		"prefix": "get",
34 | 		"body": "${1:vm}.$get(${expression})\n",
35 | 		"description": "",
36 | 		"scope": "source.js"
37 | 	},
38 | 	"ipo": {
39 | 		"prefix": "ipo",
40 | 		"body": "${1:vm}.$interpolate(${2:templateString})\n",
41 | 		"description": "",
42 | 		"scope": "source.js"
43 | 	},
44 | 	"log": {
45 | 		"prefix": "log",
46 | 		"body": "${1:vm}.$log(${2:[keyPath-optional]})\n",
47 | 		"description": "",
48 | 		"scope": "source.js"
49 | 	},
50 | 	"v": {
51 | 		"prefix": "v",
52 | 		"body": ": {\n\t${1://content\\}\n\\}\n",
53 | 		"description": "",
54 | 		"scope": "source.js"
55 | 	},
56 | 	"vue-config": {
57 | 		"prefix": "vue-config",
58 | 		"body": "{\n\tdebug: ${1:true},\n\tstrict: ${2:false},\n\tprefix: ${3:'v-'},\n\tdelimiters: ${4:['{{', '\\}\\}']},\n\tsilent: ${5:false},\n\tinterpolate: ${6:true},\n\tasync: ${7:true},\n\tproto: ${8:true}\n\\}\n",
59 | 		"description": "",
60 | 		"scope": "source.js"
61 | 	},
62 | 	"vue-dir": {
63 | 		"prefix": "vue-dir",
64 | 		"body": "Vue.directive('${1:my-directive}',\n\tbind: function () {\n\t\t${2://content}\n\t\\},\n\tupdate: function (newValue, oldValue) {\n\t\t${3://content}\n\t\\},\n\tunbind: function () {\n\t\t${3://content}\n\t\\}\n\\})\n",
65 | 		"description": "",
66 | 		"scope": "source.js"
67 | 	},
68 | 	"vue-extend": {
69 | 		"prefix": "vue-extend",
70 | 		"body": "var ${1:Profile} = Vue.extend\n\ttemplate: ${2:'<p>{{firstName\\}\\} {{lastName\\}\\} aka {{alias\\}\\}</p>'}\n\\})\n",
71 | 		"description": "",
72 | 		"scope": "source.js"
73 | 	},
74 | 	"vue-filter": {
75 | 		"prefix": "vue-filter",
76 | 		"body": "Vue.filter('${1:my-filter}', function (${2:value}) {\n\t${3://content}\n\\})\n",
77 | 		"description": "",
78 | 		"scope": "source.js"
79 | 	},
80 | 	"vue": {
81 | 		"prefix": "vue",
82 | 		"body": "var ${1:vm} = new Vue({\n\tel: \"#${2:replace}\"\n\\})\n",
83 | 		"description": "",
84 | 		"scope": "source.js"
85 | 	},
86 | 	"wat": {
87 | 		"prefix": "wat",
88 | 		"body": "${1:vm}.$watch('${2:someObject}', function (${3:newVal}, ${4:oldVal}) {\n\t${5://content}\n\\})\n",
89 | 		"description": "",
90 | 		"scope": "source.js"
91 | 	}
92 | }


--------------------------------------------------------------------------------
/syntaxes/vue.tmLanguage.json:
--------------------------------------------------------------------------------
  1 | {
  2 |   "fileTypes": [
  3 |     "vue"
  4 |   ],
  5 |   "foldingStartMarker": "(?x)\n(<(?i:head|body|table|thead|tbody|tfoot|tr|div|select|fieldset|style|script|ul|ol|li|form|dl)\\b.*?>\n|<!--(?!.*--\\s*>)\n|^<!--\\ \\#tminclude\\ (?>.*?-->)$\n|<\\?(?:php)?.*\\b(if|for(each)?|while)\\b.+:\n|\\{\\{?(if|foreach|capture|literal|foreach|php|section|strip)\n|\\{\\s*($|\\?>\\s*$|\/\/|\/\\*(.*\\*\/\\s*$|(?!.*?\\*\/)))\n)",
  6 |   "foldingStopMarker": "(?x)\n(<\/(?i:head|body|table|thead|tbody|tfoot|tr|div|select|fieldset|style|script|ul|ol|li|form|dl)>\n|^(?!.*?<!--).*?--\\s*>\n|^<!--\\ end\\ tminclude\\ -->$\n|<\\?(?:php)?.*\\bend(if|for(each)?|while)\\b\n|\\{\\{?\/(if|foreach|capture|literal|foreach|php|section|strip)\n|^[^{]*\\}\n)",
  7 |   "keyEquivalent": "^~H",
  8 |   "name": "Vue Component",
  9 |   "patterns": [
 10 |     {
 11 |       "include": "#vue-interpolations"
 12 |     },
 13 |     {
 14 |       "begin": "(<)([a-zA-Z0-9:-]++)(?=[^>]*><\/\\2>)",
 15 |       "beginCaptures": {
 16 |         "1": {
 17 |           "name": "punctuation.definition.tag.begin.html"
 18 |         },
 19 |         "2": {
 20 |           "name": "entity.name.tag.html"
 21 |         }
 22 |       },
 23 |       "end": "(>)(<)(\/)(\\2)(>)",
 24 |       "endCaptures": {
 25 |         "1": {
 26 |           "name": "punctuation.definition.tag.end.html"
 27 |         },
 28 |         "2": {
 29 |           "name": "punctuation.definition.tag.begin.html meta.scope.between-tag-pair.html"
 30 |         },
 31 |         "3": {
 32 |           "name": "punctuation.definition.tag.begin.html"
 33 |         },
 34 |         "4": {
 35 |           "name": "entity.name.tag.html"
 36 |         },
 37 |         "5": {
 38 |           "name": "punctuation.definition.tag.end.html"
 39 |         }
 40 |       },
 41 |       "name": "meta.tag.any.html",
 42 |       "patterns": [
 43 |         {
 44 |           "include": "#tag-stuff"
 45 |         }
 46 |       ]
 47 |     },
 48 |     {
 49 |       "begin": "(<\\?)(xml)",
 50 |       "captures": {
 51 |         "1": {
 52 |           "name": "punctuation.definition.tag.html"
 53 |         },
 54 |         "2": {
 55 |           "name": "entity.name.tag.xml.html"
 56 |         }
 57 |       },
 58 |       "end": "(\\?>)",
 59 |       "name": "meta.tag.preprocessor.xml.html",
 60 |       "patterns": [
 61 |         {
 62 |           "include": "#tag-generic-attribute"
 63 |         },
 64 |         {
 65 |           "include": "#string-double-quoted"
 66 |         },
 67 |         {
 68 |           "include": "#string-single-quoted"
 69 |         }
 70 |       ]
 71 |     },
 72 |     {
 73 |       "begin": "<!--",
 74 |       "captures": [
 75 |         {
 76 |           "name": "punctuation.definition.comment.html"
 77 |         }
 78 |       ],
 79 |       "end": "--\\s*>",
 80 |       "name": "comment.block.html",
 81 |       "patterns": [
 82 |         {
 83 |           "match": "--",
 84 |           "name": "invalid.illegal.bad-comments-or-CDATA.html"
 85 |         }
 86 |       ]
 87 |     },
 88 |     {
 89 |       "begin": "<!",
 90 |       "captures": [
 91 |         {
 92 |           "name": "punctuation.definition.tag.html"
 93 |         }
 94 |       ],
 95 |       "end": ">",
 96 |       "name": "meta.tag.sgml.html",
 97 |       "patterns": [
 98 |         {
 99 |           "begin": "(?i:DOCTYPE)",
100 |           "captures": {
101 |             "1": {
102 |               "name": "entity.name.tag.doctype.html"
103 |             }
104 |           },
105 |           "end": "(?=>)",
106 |           "name": "meta.tag.sgml.doctype.html",
107 |           "patterns": [
108 |             {
109 |               "match": "\"[^\">]*\"",
110 |               "name": "string.quoted.double.doctype.identifiers-and-DTDs.html"
111 |             }
112 |           ]
113 |         },
114 |         {
115 |           "begin": "\\[CDATA\\[",
116 |           "end": "]](?=>)",
117 |           "name": "constant.other.inline-data.html"
118 |         },
119 |         {
120 |           "match": "(\\s*)(?!--|>)\\S(\\s*)",
121 |           "name": "invalid.illegal.bad-comments-or-CDATA.html"
122 |         }
123 |       ]
124 |     },
125 |     {
126 |       "begin": "(?:^\\s+)?(<)((?i:template))\\b(?=[^>]*lang=\"slm(?:\\?[^\"]*)?\")",
127 |       "captures": {
128 |         "1": {
129 |           "name": "punctuation.definition.tag.begin.html"
130 |         },
131 |         "2": {
132 |           "name": "entity.name.tag.style.html"
133 |         },
134 |         "3": {
135 |           "name": "punctuation.definition.tag.html"
136 |         }
137 |       },
138 |       "end": "(<\/)((?i:template))(>)(?:\\s*\\n)?",
139 |       "name": "text.slm.embedded.html",
140 |       "patterns": [
141 |         {
142 |           "include": "#tag-stuff"
143 |         },
144 |         {
145 |           "begin": "(>)",
146 |           "beginCaptures": {
147 |             "1": {
148 |               "name": "punctuation.definition.tag.end.html"
149 |             }
150 |           },
151 |           "end": "(?=<\/(?i:template))",
152 |           "patterns": [
153 |             {
154 |               "include": "text.slm"
155 |             }
156 |           ]
157 |         }
158 |       ]
159 |     },
160 |     {
161 |       "begin": "(?:^\\s+)?(<)((?i:template))\\b(?=[^>]*lang=\"jade(?:\\?[^\"]*)?\")",
162 |       "captures": {
163 |         "1": {
164 |           "name": "punctuation.definition.tag.begin.html"
165 |         },
166 |         "2": {
167 |           "name": "entity.name.tag.style.html"
168 |         },
169 |         "3": {
170 |           "name": "punctuation.definition.tag.html"
171 |         }
172 |       },
173 |       "end": "(<\/)((?i:template))(>)(?:\\s*\\n)?",
174 |       "name": "text.jade.embedded.html",
175 |       "patterns": [
176 |         {
177 |           "include": "#tag-stuff"
178 |         },
179 |         {
180 |           "begin": "(>)",
181 |           "beginCaptures": {
182 |             "1": {
183 |               "name": "punctuation.definition.tag.end.html"
184 |             }
185 |           },
186 |           "end": "(?=<\/(?i:template))",
187 |           "patterns": [
188 |             {
189 |               "include": "text.jade"
190 |             }
191 |           ]
192 |         }
193 |       ]
194 |     },
195 |     {
196 |       "begin": "(?:^\\s+)?(<)((?i:template))\\b(?=[^>]*lang=\"pug(?:\\?[^\"]*)?\")",
197 |       "captures": {
198 |         "1": {
199 |           "name": "punctuation.definition.tag.begin.html"
200 |         },
201 |         "2": {
202 |           "name": "entity.name.tag.style.html"
203 |         },
204 |         "3": {
205 |           "name": "punctuation.definition.tag.html"
206 |         }
207 |       },
208 |       "end": "(<\/)((?i:template))(>)(?:\\s*\\n)?",
209 |       "name": "text.jade.embedded.html",
210 |       "patterns": [
211 |         {
212 |           "include": "#tag-stuff"
213 |         },
214 |         {
215 |           "begin": "(>)",
216 |           "beginCaptures": {
217 |             "1": {
218 |               "name": "punctuation.definition.tag.end.html"
219 |             }
220 |           },
221 |           "end": "(?=<\/(?i:template))",
222 |           "patterns": [
223 |             {
224 |               "include": "text.jade"
225 |             }
226 |           ]
227 |         }
228 |       ]
229 |     },
230 |     {
231 |       "begin": "(?:^\\s+)?(<)((?i:style))\\b(?=[^>]*lang=\"stylus(?:\\?[^\"]*)?\")",
232 |       "captures": {
233 |         "1": {
234 |           "name": "punctuation.definition.tag.begin.html"
235 |         },
236 |         "2": {
237 |           "name": "entity.name.tag.style.html"
238 |         },
239 |         "3": {
240 |           "name": "punctuation.definition.tag.html"
241 |         }
242 |       },
243 |       "end": "(<\/)((?i:style))(>)(?:\\s*\\n)?",
244 |       "name": "source.stylus.embedded.html",
245 |       "patterns": [
246 |         {
247 |           "include": "#tag-stuff"
248 |         },
249 |         {
250 |           "begin": "(>)",
251 |           "beginCaptures": {
252 |             "1": {
253 |               "name": "punctuation.definition.tag.end.html"
254 |             }
255 |           },
256 |           "end": "(?=<\/(?i:style))",
257 |           "patterns": [
258 |             {
259 |               "include": "source.stylus"
260 |             }
261 |           ]
262 |         }
263 |       ]
264 |     },
265 |     {
266 |       "begin": "(?:^\\s+)?(<)((?i:style))\\b(?=[^>]*lang=\"postcss(?:\\?[^\"]*)?\")",
267 |       "captures": {
268 |         "1": {
269 |           "name": "punctuation.definition.tag.begin.html"
270 |         },
271 |         "2": {
272 |           "name": "entity.name.tag.style.html"
273 |         },
274 |         "3": {
275 |           "name": "punctuation.definition.tag.html"
276 |         }
277 |       },
278 |       "end": "(<\/)((?i:style))(>)(?:\\s*\\n)?",
279 |       "name": "source.postcss.embedded.html",
280 |       "patterns": [
281 |         {
282 |           "include": "#tag-stuff"
283 |         },
284 |         {
285 |           "begin": "(>)",
286 |           "beginCaptures": {
287 |             "1": {
288 |               "name": "punctuation.definition.tag.end.html"
289 |             }
290 |           },
291 |           "end": "(?=<\/(?i:style))",
292 |           "patterns": [
293 |             {
294 |               "include": "source.postcss"
295 |             }
296 |           ]
297 |         }
298 |       ]
299 |     },
300 |     {
301 |       "begin": "(?:^\\s+)?(<)((?i:style))\\b(?=[^>]*lang=\"(?:scss)(?:\\?[^\"]*)?\")",
302 |       "captures": {
303 |         "1": {
304 |           "name": "punctuation.definition.tag.begin.html"
305 |         },
306 |         "2": {
307 |           "name": "entity.name.tag.style.html"
308 |         },
309 |         "3": {
310 |           "name": "punctuation.definition.tag.html"
311 |         }
312 |       },
313 |       "end": "(<\/)((?i:style))(>)(?:\\s*\\n)?",
314 |       "name": "source.css.scss.embedded.html",
315 |       "patterns": [
316 |         {
317 |           "include": "#tag-stuff"
318 |         },
319 |         {
320 |           "begin": "(>)",
321 |           "beginCaptures": {
322 |             "1": {
323 |               "name": "punctuation.definition.tag.end.html"
324 |             }
325 |           },
326 |           "end": "(?=<\/(?i:style))",
327 |           "patterns": [
328 |             {
329 |               "include": "source.css.scss"
330 |             }
331 |           ]
332 |         }
333 |       ]
334 |     },
335 |     {
336 |       "begin": "(?:^\\s+)?(<)((?i:style))\\b(?=[^>]*lang=\"(?:sass)(?:\\?[^\"]*)?\")",
337 |       "captures": {
338 |         "1": {
339 |           "name": "punctuation.definition.tag.begin.html"
340 |         },
341 |         "2": {
342 |           "name": "entity.name.tag.style.html"
343 |         },
344 |         "3": {
345 |           "name": "punctuation.definition.tag.html"
346 |         }
347 |       },
348 |       "end": "(<\/)((?i:style))(>)(?:\\s*\\n)?",
349 |       "name": "source.sass.embedded.html",
350 |       "patterns": [
351 |         {
352 |           "include": "#tag-stuff"
353 |         },
354 |         {
355 |           "begin": "(>)",
356 |           "beginCaptures": {
357 |             "1": {
358 |               "name": "punctuation.definition.tag.end.html"
359 |             }
360 |           },
361 |           "end": "(?=<\/(?i:style))",
362 |           "patterns": [
363 |             {
364 |               "include": "source.sass"
365 |             }
366 |           ]
367 |         }
368 |       ]
369 |     },
370 |     {
371 |       "begin": "(?:^\\s+)?(<)((?i:style))\\b(?=[^>]*lang=\"less(?:\\?[^\"]*)?\")",
372 |       "captures": {
373 |         "1": {
374 |           "name": "punctuation.definition.tag.begin.html"
375 |         },
376 |         "2": {
377 |           "name": "entity.name.tag.style.html"
378 |         },
379 |         "3": {
380 |           "name": "punctuation.definition.tag.html"
381 |         }
382 |       },
383 |       "end": "(<\/)((?i:style))(>)(?:\\s*\\n)?",
384 |       "name": "source.css.less.embedded.html",
385 |       "patterns": [
386 |         {
387 |           "include": "#tag-stuff"
388 |         },
389 |         {
390 |           "begin": "(>)",
391 |           "beginCaptures": {
392 |             "1": {
393 |               "name": "punctuation.definition.tag.end.html"
394 |             }
395 |           },
396 |           "end": "(?=<\/(?i:style))",
397 |           "patterns": [
398 |             {
399 |               "include": "source.css.less"
400 |             }
401 |           ]
402 |         }
403 |       ]
404 |     },
405 |     {
406 |       "begin": "(?:^\\s+)?(<)((?i:style))\\b(?![^>]*\/>)",
407 |       "captures": {
408 |         "1": {
409 |           "name": "punctuation.definition.tag.begin.html"
410 |         },
411 |         "2": {
412 |           "name": "entity.name.tag.style.html"
413 |         },
414 |         "3": {
415 |           "name": "punctuation.definition.tag.html"
416 |         }
417 |       },
418 |       "end": "(<\/)((?i:style))(>)(?:\\s*\\n)?",
419 |       "name": "source.css.embedded.html",
420 |       "patterns": [
421 |         {
422 |           "include": "#tag-stuff"
423 |         },
424 |         {
425 |           "begin": "(>)",
426 |           "beginCaptures": {
427 |             "1": {
428 |               "name": "punctuation.definition.tag.end.html"
429 |             }
430 |           },
431 |           "end": "(?=<\/(?i:style))",
432 |           "patterns": [
433 |             {
434 |               "include": "source.css"
435 |             }
436 |           ]
437 |         }
438 |       ]
439 |     },
440 |     {
441 |       "begin": "(?:^\\s+)?(<)((?i:script))\\b(?=[^>]*lang=\"coffee(?:\\?[^\"]*)?\")",
442 |       "beginCaptures": {
443 |         "1": {
444 |           "name": "punctuation.definition.tag.begin.html"
445 |         },
446 |         "2": {
447 |           "name": "entity.name.tag.script.html"
448 |         }
449 |       },
450 |       "end": "(?<=<\/(script|SCRIPT))(>)(?:\\s*\\n)?",
451 |       "endCaptures": {
452 |         "2": {
453 |           "name": "punctuation.definition.tag.html"
454 |         }
455 |       },
456 |       "name": "source.coffee.embedded.html",
457 |       "patterns": [
458 |         {
459 |           "include": "#tag-stuff"
460 |         },
461 |         {
462 |           "begin": "(?<!<\/(?:script|SCRIPT))(>)",
463 |           "captures": {
464 |             "1": {
465 |               "name": "punctuation.definition.tag.begin.html"
466 |             },
467 |             "2": {
468 |               "name": "entity.name.tag.script.html"
469 |             }
470 |           },
471 |           "end": "(<\/)((?i:script))",
472 |           "patterns": [
473 |             {
474 |               "include": "source.coffee"
475 |             }
476 |           ]
477 |         }
478 |       ]
479 |     },
480 |     {
481 |       "begin": "(?:^\\s+)?(<)((?i:script))\\b(?=[^>]*lang=\"livescript(?:\\?[^\"]*)?\")",
482 |       "beginCaptures": {
483 |         "1": {
484 |           "name": "punctuation.definition.tag.begin.html"
485 |         },
486 |         "2": {
487 |           "name": "entity.name.tag.script.html"
488 |         }
489 |       },
490 |       "end": "(?<=<\/(script|SCRIPT))(>)(?:\\s*\\n)?",
491 |       "endCaptures": {
492 |         "2": {
493 |           "name": "punctuation.definition.tag.html"
494 |         }
495 |       },
496 |       "name": "source.livescript.embedded.html",
497 |       "patterns": [
498 |         {
499 |           "include": "#tag-stuff"
500 |         },
501 |         {
502 |           "begin": "(?<!<\/(?:script|SCRIPT))(>)",
503 |           "captures": {
504 |             "1": {
505 |               "name": "punctuation.definition.tag.begin.html"
506 |             },
507 |             "2": {
508 |               "name": "entity.name.tag.script.html"
509 |             }
510 |           },
511 |           "end": "(<\/)((?i:script))",
512 |           "patterns": [
513 |             {
514 |               "include": "source.livescript"
515 |             }
516 |           ]
517 |         }
518 |       ]
519 |     },
520 |     {
521 |       "begin": "(?:^\\s+)?(<)((?i:script))\\b(?![^>]*/>)(?![^>]*(?i:type.?=.?text/((?!javascript|babel).*)))",
522 |       "beginCaptures": {
523 |         "1": {
524 |           "name": "punctuation.definition.tag.begin.html"
525 |         },
526 |         "2": {
527 |           "name": "entity.name.tag.script.html"
528 |         }
529 |       },
530 |       "end": "(?<=<\/(script|SCRIPT))(>)(?:\\s*\\n)?",
531 |       "endCaptures": {
532 |         "2": {
533 |           "name": "punctuation.definition.tag.html"
534 |         }
535 |       },
536 |       "name": "source.js.embedded.html",
537 |       "patterns": [
538 |         {
539 |           "include": "#tag-stuff"
540 |         },
541 |         {
542 |           "begin": "(?<!<\/(?:script|SCRIPT))(>)",
543 |           "captures": {
544 |             "1": {
545 |               "name": "punctuation.definition.tag.begin.html"
546 |             },
547 |             "2": {
548 |               "name": "entity.name.tag.script.html"
549 |             }
550 |           },
551 |           "end": "(<\/)((?i:script))",
552 |           "patterns": [
553 |             {
554 |               "captures": {
555 |                 "1": {
556 |                   "name": "punctuation.definition.comment.js"
557 |                 }
558 |               },
559 |               "match": "(\/\/).*?((?=<\/script)|$\\n?)",
560 |               "name": "comment.line.double-slash.js"
561 |             },
562 |             {
563 |               "begin": "\/\\*",
564 |               "captures": [
565 |                 {
566 |                   "name": "punctuation.definition.comment.js"
567 |                 }
568 |               ],
569 |               "end": "\\*\/|(?=<\/script)",
570 |               "name": "comment.block.js"
571 |             },
572 |             {
573 |               "include": "source.js"
574 |             }
575 |           ]
576 |         }
577 |       ]
578 |     },
579 |     {
580 |       "begin": "(<\/?)((?i:body|head|html)\\b)",
581 |       "captures": {
582 |         "1": {
583 |           "name": "punctuation.definition.tag.begin.html"
584 |         },
585 |         "2": {
586 |           "name": "entity.name.tag.structure.any.html"
587 |         }
588 |       },
589 |       "end": "(>)",
590 |       "endCaptures": {
591 |         "1": {
592 |           "name": "punctuation.definition.tag.end.html"
593 |         }
594 |       },
595 |       "name": "meta.tag.structure.any.html",
596 |       "patterns": [
597 |         {
598 |           "include": "#tag-stuff"
599 |         }
600 |       ]
601 |     },
602 |     {
603 |       "begin": "(<\/?)((?i:address|blockquote|dd|div|dl|dt|fieldset|form|frame|frameset|h1|h2|h3|h4|h5|h6|iframe|noframes|object|ol|p|ul|applet|center|dir|hr|menu|pre)\\b)",
604 |       "beginCaptures": {
605 |         "1": {
606 |           "name": "punctuation.definition.tag.begin.html"
607 |         },
608 |         "2": {
609 |           "name": "entity.name.tag.block.any.html"
610 |         }
611 |       },
612 |       "end": "(>)",
613 |       "endCaptures": {
614 |         "1": {
615 |           "name": "punctuation.definition.tag.end.html"
616 |         }
617 |       },
618 |       "name": "meta.tag.block.any.html",
619 |       "patterns": [
620 |         {
621 |           "include": "#tag-stuff"
622 |         }
623 |       ]
624 |     },
625 |     {
626 |       "begin": "(<\/?)((?i:a|abbr|acronym|area|b|base|basefont|bdo|big|br|button|caption|cite|code|col|colgroup|del|dfn|em|font|head|html|i|img|input|ins|isindex|kbd|label|legend|li|link|map|meta|noscript|optgroup|option|param|q|s|samp|script|select|small|span|strike|strong|style|sub|sup|table|tbody|td|textarea|tfoot|th|thead|title|tr|tt|u|var)\\b)",
627 |       "beginCaptures": {
628 |         "1": {
629 |           "name": "punctuation.definition.tag.begin.html"
630 |         },
631 |         "2": {
632 |           "name": "entity.name.tag.inline.any.html"
633 |         }
634 |       },
635 |       "end": "((?: ?\/)?>)",
636 |       "endCaptures": {
637 |         "1": {
638 |           "name": "punctuation.definition.tag.end.html"
639 |         }
640 |       },
641 |       "name": "meta.tag.inline.any.html",
642 |       "patterns": [
643 |         {
644 |           "include": "#tag-stuff"
645 |         }
646 |       ]
647 |     },
648 |     {
649 |       "begin": "(<\/?)([a-zA-Z0-9:-]+)",
650 |       "beginCaptures": {
651 |         "1": {
652 |           "name": "punctuation.definition.tag.begin.html"
653 |         },
654 |         "2": {
655 |           "name": "entity.name.tag.other.html"
656 |         }
657 |       },
658 |       "end": "(>)",
659 |       "endCaptures": {
660 |         "1": {
661 |           "name": "punctuation.definition.tag.end.html"
662 |         }
663 |       },
664 |       "name": "meta.tag.other.html",
665 |       "patterns": [
666 |         {
667 |           "include": "#tag-stuff"
668 |         }
669 |       ]
670 |     },
671 |     {
672 |       "include": "#entities"
673 |     },
674 |     {
675 |       "match": "<>",
676 |       "name": "invalid.illegal.incomplete.html"
677 |     },
678 |     {
679 |       "match": "<",
680 |       "name": "invalid.illegal.bad-angle-bracket.html"
681 |     }
682 |   ],
683 |   "repository": {
684 |     "entities": {
685 |       "patterns": [
686 |         {
687 |           "captures": {
688 |             "1": {
689 |               "name": "punctuation.definition.entity.html"
690 |             },
691 |             "3": {
692 |               "name": "punctuation.definition.entity.html"
693 |             }
694 |           },
695 |           "match": "(&)([a-zA-Z0-9]+|#[0-9]+|#x[0-9a-fA-F]+)(;)",
696 |           "name": "constant.character.entity.html"
697 |         },
698 |         {
699 |           "match": "&",
700 |           "name": "invalid.illegal.bad-ampersand.html"
701 |         }
702 |       ]
703 |     },
704 |     "string-double-quoted": {
705 |       "begin": "\"",
706 |       "beginCaptures": [
707 |         {
708 |           "name": "punctuation.definition.string.begin.html"
709 |         }
710 |       ],
711 |       "end": "\"",
712 |       "endCaptures": [
713 |         {
714 |           "name": "punctuation.definition.string.end.html"
715 |         }
716 |       ],
717 |       "name": "string.quoted.double.html",
718 |       "patterns": [
719 |         {
720 |           "include": "#vue-interpolations"
721 |         },
722 |         {
723 |           "include": "#entities"
724 |         }
725 |       ]
726 |     },
727 |     "string-single-quoted": {
728 |       "begin": "'",
729 |       "beginCaptures": [
730 |         {
731 |           "name": "punctuation.definition.string.begin.html"
732 |         }
733 |       ],
734 |       "end": "'",
735 |       "endCaptures": [
736 |         {
737 |           "name": "punctuation.definition.string.end.html"
738 |         }
739 |       ],
740 |       "name": "string.quoted.single.html",
741 |       "patterns": [
742 |         {
743 |           "include": "#vue-interpolations"
744 |         },
745 |         {
746 |           "include": "#entities"
747 |         }
748 |       ]
749 |     },
750 |     "tag-generic-attribute": {
751 |       "match": "\\b([a-zA-Z\\-:]+)",
752 |       "name": "entity.other.attribute-name.html"
753 |     },
754 |     "tag-id-attribute": {
755 |       "begin": "\\b(id)\\b\\s*(=)",
756 |       "captures": {
757 |         "1": {
758 |           "name": "entity.other.attribute-name.id.html"
759 |         },
760 |         "2": {
761 |           "name": "punctuation.separator.key-value.html"
762 |         }
763 |       },
764 |       "end": "(?<='|\")",
765 |       "name": "meta.attribute-with-value.id.html",
766 |       "patterns": [
767 |         {
768 |           "begin": "\"",
769 |           "beginCaptures": [
770 |             {
771 |               "name": "punctuation.definition.string.begin.html"
772 |             }
773 |           ],
774 |           "contentName": "meta.toc-list.id.html",
775 |           "end": "\"",
776 |           "endCaptures": [
777 |             {
778 |               "name": "punctuation.definition.string.end.html"
779 |             }
780 |           ],
781 |           "name": "string.quoted.double.html",
782 |           "patterns": [
783 |             {
784 |               "include": "#vue-interpolations"
785 |             },
786 |             {
787 |               "include": "#entities"
788 |             }
789 |           ]
790 |         },
791 |         {
792 |           "begin": "'",
793 |           "beginCaptures": [
794 |             {
795 |               "name": "punctuation.definition.string.begin.html"
796 |             }
797 |           ],
798 |           "contentName": "meta.toc-list.id.html",
799 |           "end": "'",
800 |           "endCaptures": [
801 |             {
802 |               "name": "punctuation.definition.string.end.html"
803 |             }
804 |           ],
805 |           "name": "string.quoted.single.html",
806 |           "patterns": [
807 |             {
808 |               "include": "#vue-interpolations"
809 |             },
810 |             {
811 |               "include": "#entities"
812 |             }
813 |           ]
814 |         }
815 |       ]
816 |     },
817 |     "tag-stuff": {
818 |       "patterns": [
819 |         {
820 |           "include": "#vue-directives"
821 |         },
822 |         {
823 |           "include": "#tag-id-attribute"
824 |         },
825 |         {
826 |           "include": "#tag-generic-attribute"
827 |         },
828 |         {
829 |           "include": "#string-double-quoted"
830 |         },
831 |         {
832 |           "include": "#string-single-quoted"
833 |         }
834 |       ]
835 |     },
836 |     "vue-directives": {
837 |       "begin": "(?:\\b(v-)|(:|@))([a-zA-Z\\-]+)(?:\\:([a-zA-Z\\-]+))?(?:\\.([a-zA-Z\\-]+))*\\s*(=)",
838 |       "captures": {
839 |         "1": {
840 |           "name": "entity.other.attribute-name.html"
841 |         },
842 |         "2": {
843 |           "name": "punctuation.separator.key-value.html"
844 |         },
845 |         "3": {
846 |           "name": "entity.other.attribute-name.html"
847 |         },
848 |         "4": {
849 |           "name": "entity.other.attribute-name.html"
850 |         },
851 |         "5": {
852 |           "name": "entity.other.attribute-name.html"
853 |         },
854 |         "6": {
855 |           "name": "punctuation.separator.key-value.html"
856 |         }
857 |       },
858 |       "end": "(?<='|\")",
859 |       "name": "meta.directive.vue",
860 |       "patterns": [
861 |         {
862 |           "begin": "\"",
863 |           "beginCaptures": [
864 |             {
865 |               "name": "punctuation.definition.string.begin.html"
866 |             }
867 |           ],
868 |           "end": "\"",
869 |           "endCaptures": [
870 |             {
871 |               "name": "punctuation.definition.string.end.html"
872 |             }
873 |           ],
874 |           "name": "source.directive.vue",
875 |           "patterns": [
876 |             {
877 |               "include": "source.js"
878 |             }
879 |           ]
880 |         },
881 |         {
882 |           "begin": "'",
883 |           "beginCaptures": [
884 |             {
885 |               "name": "punctuation.definition.string.begin.html"
886 |             }
887 |           ],
888 |           "end": "'",
889 |           "endCaptures": [
890 |             {
891 |               "name": "punctuation.definition.string.end.html"
892 |             }
893 |           ],
894 |           "name": "source.directive.vue",
895 |           "patterns": [
896 |             {
897 |               "include": "source.js"
898 |             }
899 |           ]
900 |         }
901 |       ]
902 |     },
903 |     "vue-interpolations": {
904 |       "patterns": [
905 |         {
906 |           "begin": "\\{\\{\\{?",
907 |           "beginCaptures": [
908 |             {
909 |               "name": "punctuation.definition.generic.begin.html"
910 |             }
911 |           ],
912 |           "end": "\\}\\}\\}?",
913 |           "endCaptures": [
914 |             {
915 |               "name": "punctuation.definition.generic.end.html"
916 |             }
917 |           ],
918 |           "name": "expression.embbeded.vue",
919 |           "patterns": [
920 |             {
921 |               "include": "source.js"
922 |             }
923 |           ]
924 |         }
925 |       ]
926 |     }
927 |   },
928 |   "scopeName": "text.html.vue",
929 |   "uuid": "5512c10d-4cc5-434c-b8fc-53b912f55ab3"
930 | }


--------------------------------------------------------------------------------
/vsc-extension-quickstart.md:
--------------------------------------------------------------------------------
 1 | # Welcome to your VS Code Extension
 2 | 
 3 | ## What's in the folder
 4 | * This folder contains all of the files necessary for your extension
 5 | * `package.json` - this is the manifest file in which you declare your language support and define
 6 | the location of the grammar file that has been copied into you extension.
 7 | * `syntaxes/vue.tmLanguage` - this is the Text mate grammar file that is used for tokenization
 8 | * `vue.configuration.json` - this the language configuration, defining the tokens that are used for
 9 | comments and brackets.
10 | 
11 | ## Get up and running straight away
12 | * Make sure the language configuration settings in `vue.configuration.json` are accurate
13 | * press `F5` to open a new window with your extension loaded
14 | * create a new file with a file name suffix matching your language
15 | * verify that syntax highlight works and that the language configuration settings are working
16 | 
17 | ## Make changes
18 | * you can relaunch the extension from the debug toolbar after making changes to the files listed above
19 | * you can also reload (`Ctrl+R` or `Cmd+R` on Mac) the VS Code window with your extension to load your changes
20 | 
21 | ## Add more language features
22 | * To add features such as intellisense, hovers and validators check out the VS Code extenders documentation at
23 | https://code.visualstudio.com/docs
24 | 
25 | ## Install your extension
26 | * To start using your extension with Visual Studio Code copy it into the <user home>/.vscode/extensions folder and restart Code.
27 | * To share your extension with the world, read on https://code.visualstudio.com/docs about publishing an extension.


--------------------------------------------------------------------------------
/vue.configuration.json:
--------------------------------------------------------------------------------
 1 | {
 2 | 	"comments": {
 3 | 		// symbol used for single line comment. Remove this entry if your language does not support line comments
 4 | 		"lineComment": "//",
 5 | 		// symbols used for start and end a block comment. Remove this entry if your language does not support block comments
 6 | 		"blockComment": [ "/*", "*/" ]
 7 | 	},
 8 | 	// symbols used as brackets
 9 | 	"brackets": [
10 | 		["{", "}"],
11 | 		["[", "]"],
12 | 		["(", ")"]
13 | 	]
14 | }


--------------------------------------------------------------------------------