fix: Replace ES6 usage for IE11 compatibility (#1500)

* Remove ES6 syntax for IE11 compatibility

* Replace unsupported methods (IE11)

docs/index.html

@@ -113,12 +113,9 @@
         },
         vueComponents: {
           'button-counter': {
-            template: `
-            <button @click="count += 1">
-              You clicked me {{ count }} times
-            </button>
-          `,
-            data() {
+            template:
+              '<button @click="count += 1">You clicked me {{ count }} times</button>',
+            data: function() {
               return {
                 count: 0,
               };
@@ -126,7 +123,7 @@
           },
         },
         vueGlobalOptions: {
-          data() {
+          data: function() {
             return {
               count: 0,
               message: 'Hello, World!',
@@ -139,7 +136,7 @@
             };
           },
           computed: {
-            timeOfDay() {
+            timeOfDay: function() {
               const date = new Date();
               const hours = date.getHours();
 
@@ -160,7 +157,7 @@
         },
         vueMounts: {
           '#counter': {
-            data() {
+            data: function() {
               return {
                 count: 0,
               };
@@ -195,7 +192,10 @@
                 if (vm.route.path === '/') {
                   return html;
                 }
-                return `${html}<br/> <i>Vercel</i> has given us a Pro account <br/> <a href="https://vercel.com/?utm_source=docsifyjsdocs" target="_blank"><img src="_media/vercel_logo.svg" alt="Vercel" width="100" height="64"></a>`;
+                return (
+                  html +
+                  '<br/> <i>Vercel</i> has given us a Pro account <br/> <a href="https://vercel.com/?utm_source=docsifyjsdocs" target="_blank"><img src="_media/vercel_logo.svg" alt="Vercel" width="100" height="64"></a>'
+                );
               });
           },
         ],

src/core/render/index.js

@@ -7,7 +7,7 @@ import { callHook } from '../init/lifecycle';
 import { getAndActive, sticky } from '../event/sidebar';
 import { getPath, isAbsolutePath } from '../router/util';
 import { isMobile, inBrowser } from '../util/env';
-import { isPrimitive } from '../util/core';
+import { isPrimitive, merge } from '../util/core';
 import { scrollActiveSidebar } from '../event/scroll';
 import { Compiler } from './compiler';
 import * as tpl from './tpl';
@@ -116,10 +116,10 @@ function renderMain(html) {
 
     // vueMounts
     vueMountData.push(
-      ...Object.entries(docsifyConfig.vueMounts || {})
-        .map(([cssSelector, vueConfig]) => [
+      ...Object.keys(docsifyConfig.vueMounts || {})
+        .map(cssSelector => [
           dom.find(markdownElm, cssSelector),
-          vueConfig,
+          docsifyConfig.vueMounts[cssSelector],
         ])
         .filter(([elm, vueConfig]) => elm)
     );
@@ -169,10 +169,7 @@ function renderMain(html) {
           })
           .map(elm => {
             // Clone global configuration
-            const vueConfig = Object.assign(
-              {},
-              docsifyConfig.vueGlobalOptions || {}
-            );
+            const vueConfig = merge({}, docsifyConfig.vueGlobalOptions || {});
 
             // Replace vueGlobalOptions data() return value with shared data object.
             // This provides a global store for all Vue instances that receive