support for vue.js, closes #71

aaron-bond · May 31, 2018 · 2b14d2e · 2b14d2e
1 parent 990fc7a
commit 2b14d2e
Show file tree

Hide file tree

Showing 5 changed files with 67 additions and 3 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,11 +1,12 @@
 # Change Log
 
-## [1.2.4] (2018-05-??)
+## [1.2.4] (2018-05-31)
 ### Features
-* Adding new property for tags: **backgroundColor** ([](https://github.com/aaron-bond/better-comments/commit/)), closes [#66](https://github.com/aaron-bond/better-comments/issues/66)
+* Adding new property for tags: **backgroundColor** ([3e7a188](https://github.com/aaron-bond/better-comments/commit/3e7a188)), closes [#66](https://github.com/aaron-bond/better-comments/issues/66)
 	-  default: `transparent`
-* Adding support for: PlainText ([](https://github.com/aaron-bond/better-comments/commit/)), closes [#39](https://github.com/aaron-bond/better-comments/issues/39)  
+* Adding support for: PlainText ([27ff774](https://github.com/aaron-bond/better-comments/commit/27ff774)), closes [#39](https://github.com/aaron-bond/better-comments/issues/39)  
 	-  PlainText support must be turned on in the settings: `highlightPlainText`
+* Adding support for: Vue.js ([](https://github.com/aaron-bond/better-comments/commit/)), closes [#71](https://github.com/aaron-bond/better-comments/issues/71) 
 
 ## [1.2.3] (2018-05-20)
 ### Features

diff --git a/README.md b/README.md
@@ -112,4 +112,5 @@ The default 5 can be modifed to change the colors, and more can be added.
 * TypeScript
 * TypeScript React
 * Visual Basic
+* Vue.js
 * YAML
diff --git a/package.json b/package.json
@@ -78,6 +78,7 @@
         "onLanguage:typescript",
         "onLanguage:typescriptreact",
         "onLanguage:vb",
+        "onLanguage:vue",
         "onLanguage:yaml"
     ],
     "galleryBanner": {

diff --git a/src/parser.ts b/src/parser.ts
@@ -204,6 +204,7 @@ export class Parser {
 			case "swift":
 			case "typescript":
 			case "typescriptreact":
+			case "vue":
 				this.delimiter = "//";
 				this.highlightMultilineComments = this.contributions.multilineComments;
 				break;

diff --git a/src/test/samples/vuejs.vue b/src/test/samples/vuejs.vue
@@ -0,0 +1,60 @@
+<template>
+  <div id="el"></div>
+</template>
+
+<script>
+Vue.component("select2", {
+  props: ["options", "value"],
+  template: "#select2-template",
+  mounted: function() {
+    var vm = this;
+    $(this.$el)
+      // ! init select2
+      .select2({ data: this.options })
+      .val(this.value)
+      .trigger("change")
+      // emit event on change.
+      .on("change", function() {
+        vm.$emit("input", this.value);
+      });
+  },
+  /*
+   ! non jsdoc comment
+   * highlighted
+   */
+  watch: {
+    value: function(value) {
+      // ? update value
+      $(this.$el)
+        .val(value)
+        .trigger("change");
+    },
+    options: function(options) {
+      // * update options
+      $(this.$el)
+        .empty()
+        .select2({ data: options });
+    }
+  },
+
+  /**
+   * This is a block comment
+   * ! some stuff
+   * TODO: a message
+   */  
+  destroyed: function() {
+    $(this.$el)
+      .off()
+      .select2("destroy");
+  }
+});
+
+var vm = new Vue({
+  el: "#el",
+  template: "#demo-template",
+  data: {
+    selected: 2,
+    options: [{ id: 1, text: "Hello" }, { id: 2, text: "World" }]
+  }
+});
+</script>