fix: gitalk cannot login; feat: manifest

Author: Rain120

docs/.vuepress/components/MySWUpdatePopup.vue

@@ -21,7 +21,7 @@ export default {
 @keyframes drop {
   0% {
     top: -20px;
-    oapcity: 0;
+    opacity: 0;
   }
 
   100% {
@@ -52,8 +52,6 @@ export default {
 
 .my-sw-update-popup button {
   background-color: #4db6ac;
-  -moz-border-radius: 28px;
-  -webkit-border-radius: 28px;
   border-radius: 28px;
   border: 1px solid #18ab29;
   display: inline-block;
@@ -62,7 +60,7 @@ export default {
   font-family: Arial;
   font-size: 16px;
   margin: 12px 50px;
-  padding:13px 30px;
+  padding: 13px 30px;
   text-decoration: none;
   text-shadow: 0px 1px 0px #2f6627;
 }

docs/.vuepress/enhanceApp.js

@@ -1,78 +1,24 @@
 /*
  * @Author: Rainy
  * @Date: 2019-12-01 14:25:59
- * @LastEditors: Rainy
- * @LastEditTime: 2019-12-05 20:38:59
+ * @LastEditors  : Rainy
+ * @LastEditTime : 2020-02-07 12:53:01
  */
 
-function tryRun (fn, times = 3) {
-  let execCount = 1;
-  fn(next);
-  function next(delay) {
-    if (execCount >= times) {
-      return;
-    }
-    setTimeout(() => {
-    execCount += 1
-    fn(next)
-    }, delay);
-  }
-}
-
-function integrateGitalk(router) {
-  const linkGitalk = document.createElement('link');
-  linkGitalk.href = 'https://cdn.jsdelivr.net/npm/gitalk@1/dist/gitalk.css';
-  linkGitalk.rel = 'stylesheet';
-  document.body.appendChild(linkGitalk);
-  const scriptGitalk = document.createElement('script');
-  scriptGitalk.src = 'https://cdn.jsdelivr.net/npm/gitalk@1/dist/gitalk.min.js';
-  document.body.appendChild(scriptGitalk);
+// import copy from './utils/copy';
+import getGitalk from './utils/getGitalk';
 
-  router.afterEach((to, from) => {
-
-    if (scriptGitalk.onload) {
-      loadGitalk(to);
-    } else {
-      scriptGitalk.onload = () => {
-        loadGitalk(to);
-      };
+export default ({ Vue, options, router, siteData }) => {
+  setTimeout(() => {
+    try {
+      //对document的判断是防止编译的时候报错
+      document &&
+        (() => {
+          getGitalk({ router });
+          // copy();
+        })();
+    } catch (e) {
+      console.error(e.message);
     }
-  });
-
-  function loadGitalk(to) {
-    let commentsContainer = document.getElementById('gitalk-container');
-    if (!commentsContainer) {
-      commentsContainer = document.createElement('div');
-      commentsContainer.id = 'gitalk-container';
-      commentsContainer.classList.add('content');
-    }
-    const $page = document.querySelector('.page');
-    if ($page) {
-      $page.appendChild(commentsContainer);
-      if (typeof Gitalk !== 'undefined' && Gitalk instanceof Function) {
-        renderGitalk(to.fullPath);
-      }
-    }
-  }
-  function renderGitalk(fullPath) {
-    const gitalk = new Gitalk({
-      clientID: '58efa883d352424befd3',
-      clientSecret: 'faf0e2d7ff9355b3692d605d698f7abcbbd43388',
-      repo: 'https://github.com/Rain120/awesome-javascript-code-implementation',
-      owner: 'rain120',
-      admin: ['rain120'],
-      id: window.location.pathname || fullPath || 'comment',
-      distractionFreeMode: false,
-      language: 'zh-CN'
-    });
-    gitalk.render('gitalk-container');
-  }
-}
-
-export default ({ Vue, options, router }) => {
-  try {
-    document && integrateGitalk(router);
-  } catch (e) {
-    console.error(e.message);
-  }
+  }, 500);
 };