Remove vue-highlightjs, lightweight highlight.js

content/.vuepress/components/Hook.vue

@@ -41,12 +41,9 @@
 <script>
 
 import Vue from 'vue'
-import VueHighlightJS from 'vue-highlightjs'
 
 import EventBus from '../event-bus';
 
-Vue.use(VueHighlightJS)
-
 export default {
   data () {
     return {

content/.vuepress/components/Step1.vue

@@ -14,7 +14,7 @@
     </header>
 
     <div class="xs12" v-if="exampleCode != ''">
-      <pre v-highlightjs="exampleCode"><code class="bash"></code></pre>
+      <pre><code class="bash"><span v-html="highlight('bash',exampleCode)"></span></code></pre>
     </div>
 
     <div class="xs12" v-if="isLoading">
@@ -23,7 +23,7 @@
 
     <div class="xs12" v-if="jsonData">
       <p>Success! Here is the response for <strong>lbry://{{ address }}</strong>:</p>
-      <pre v-highlightjs="jsonData" class="json-example"><code class="json"></code></pre>
+      <pre class="json-example"><code class="json"><span v-html="highlight('json',jsonData)"></span></code></pre>
       <a href="#" class="__button-black" v-on:click="goTo(2)">Go to next step</a>
     </div>
 
@@ -76,6 +76,7 @@
 
 <script>
 import EventBus from '../event-bus';
+import hljs from 'highlight.js';
 
 export default {
   data () {
@@ -86,6 +87,13 @@ export default {
       exampleCode: ''
     }
   },
+  mounted () {
+
+    hljs.configure({
+      languages: ['bash', 'json']
+    });
+
+  },
   methods: {
     fetchMetadata () {
       var component = this;
@@ -104,6 +112,9 @@ export default {
     },
     goTo (page) {
       EventBus.$emit('HookStepUpdate', page);
+    },
+    highlight (language, text) {
+      return hljs.highlight(language, text).value;
     }
   },
   name: 'Step1'

content/.vuepress/components/Step3.vue

@@ -16,7 +16,7 @@
     </header>
 
     <div class="xs12" v-if="exampleCode != ''">
-      <pre v-highlightjs="exampleCode"><code class="bash"></code></pre>
+      <pre><code class="bash"><span v-html="highlight('bash',exampleCode)"></span></code></pre>
     </div>
 
     <div class="xs12" v-if="isLoading">
@@ -25,7 +25,7 @@
 
     <div class="xs12" v-if="jsonData">
       <p>Success! Here is the response:</p>
-      <pre v-highlightjs="jsonData" class="json-example"><code class="json"></code></pre>
+      <pre class="json-example"><code class="json"><span v-html="highlight('json',jsonData)"></span></code></pre>
     </div>
 
     <template v-if="!isLoading && !jsonData">
@@ -77,6 +77,7 @@
 
 <script>
 import EventBus from '../event-bus';
+import hljs from 'highlight.js';
 
 export default {
   data () {
@@ -88,6 +89,13 @@ export default {
       jsonData: ''
     }
   },
+  mounted () {
+
+    hljs.configure({
+      languages: ['bash', 'json']
+    });
+
+  },
   methods: {
     send () {
       var component = this;
@@ -106,10 +114,13 @@ export default {
     },
     goTo (page) {
       EventBus.$emit('HookStepUpdate', page);
+    },
+    highlight (language, text) {
+      return hljs.highlight(language, text).value;
     }
   },
   name: 'Step3'
-}
+};
 </script>
 
 <style lang="scss">

package.json

@@ -27,7 +27,6 @@
     "sass-loader": "^7.0.1",
     "slack-node": "^0.1.8",
     "vue": "^2.5.16",
-    "vue-highlightjs": "^1.3.3",
     "vue-images-loaded": "^1.1.2",
     "vue-moment": "^3.2.0",
     "vue-resource": "^1.5.0",

yarn.lock

@@ -3014,7 +3014,7 @@ heroku-ssl-redirect@0.0.4:
   version "0.0.4"
   resolved "https://registry.yarnpkg.com/heroku-ssl-redirect/-/heroku-ssl-redirect-0.0.4.tgz#21ba0707aa503b50a412a0946abfaa88ef7d082c"
 
-highlight.js@*, highlight.js@^9.12.0:
+highlight.js@^9.12.0:
   version "9.12.0"
   resolved "https://registry.yarnpkg.com/highlight.js/-/highlight.js-9.12.0.tgz#e6d9dbe57cbefe60751f02af336195870c90c01e"
 
@@ -6624,12 +6624,6 @@ vm-browserify@0.0.4:
   dependencies:
     indexof "0.0.1"
 
-vue-highlightjs@^1.3.3:
-  version "1.3.3"
-  resolved "https://registry.yarnpkg.com/vue-highlightjs/-/vue-highlightjs-1.3.3.tgz#29a0d57132fc1ce15cfa61e896918f5b718c5d52"
-  dependencies:
-    highlight.js "*"
-
 vue-hot-reload-api@^2.3.0:
   version "2.3.0"
   resolved "https://registry.yarnpkg.com/vue-hot-reload-api/-/vue-hot-reload-api-2.3.0.tgz#97976142405d13d8efae154749e88c4e358cf926"