修复：Gitalk登录报错的问题

collect-article-data.mjs

@@ -12,7 +12,7 @@ const articleData = await Promise.all(
     const { data, path } = file
     return {
       ...data,
-      path: path.replace(/\.md$/, '.html').replace('./repos/', '')
+      path: path.replace(/\.md$/, '.html').replace('./docs/', '')
     }
   })
 )

docs/.vitepress/config/theme.ts

@@ -46,17 +46,6 @@ export const themeConfig: DefaultTheme.Config = {
   // 自定义扩展: 评论配置
   commentConfig: {
     type: 'gitalk',
-    options: {
-      clientID: '1de126ce1fbdbe049709',
-      clientSecret: '035fe49874a43e5cefc28a99b7e40b1925319c62',
-      repo: 'charles7c.github.io-comments',
-      owner: 'Charles7c',
-      admin: ['Charles7c'],
-      language: 'zh-CN',
-      distractionFreeMode: false,
-      // 默认: https://cors-anywhere.azm.workers.dev/https://github.com/login/oauth/access_token
-      proxy: 'https://cors-server-ecru.vercel.app/github_access_token'
-    },
     showComment: true // 是否显示评论
   }
 }

docs/.vitepress/theme/MyLayout.vue

@@ -13,8 +13,6 @@
 import DefaultTheme from 'vitepress/theme'
 import { useData } from 'vitepress'
 import md5 from 'blueimp-md5'
-import Comment from './components/Comment.vue'
-import Footer from './components/Footer.vue'
 
 const { Layout } = DefaultTheme
 const { page, theme, frontmatter } = useData()

docs/.vitepress/theme/components/Archive.vue

@@ -81,8 +81,8 @@
 <script lang="ts" setup>
 import { computed, watchEffect } from 'vue'
 import { useRouter } from 'vitepress'
-import articleData from '../../../../../article-data.json'
-import { formatDate, getQueryParam } from '../../utils.ts'
+import articleData from '../../../../article-data.json'
+import { formatDate, getQueryParam } from '../utils.ts'
 
 const router = useRouter()
 

docs/.vitepress/theme/components/Comment.vue

@@ -6,6 +6,9 @@
 import { reactive, toRefs, onMounted } from 'vue'
 import { useData } from 'vitepress'
 import md5 from 'blueimp-md5'
+import $ from 'jquery'
+import { Message } from '@arco-design/web-vue'
+import '@arco-design/web-vue/es/message/style/css.js'
 import Gitalk from 'gitalk'
 import '../styles/gitalk.css'
 
@@ -15,25 +18,25 @@ const props = defineProps({
 })
 
 const data = reactive({
-  type: props.commentConfig?.type ?? 'gitalk',
-  options: props.commentConfig?.options ?? {}
+  type: props.commentConfig?.type ?? 'gitalk'
 })
-const { type, options } = toRefs(data)
+const { type } = toRefs(data)
 
 // 初始化评论组件配置
 const { page } = useData()
 let gitalk
 if (type.value && type.value == 'gitalk') {
   gitalk = new Gitalk({
-    clientID: options.value.clientID,
-    clientSecret: options.value.clientSecret,
-    repo: options.value.repo,
-    owner: options.value.owner,
-    admin: options.value.admin,
+    clientID: '1de126ce1fbdbe049709',
+    clientSecret: '035fe49874a43e5cefc28a99b7e40b1925319c62',
+    repo: 'charles7c.github.io',
+    owner: 'Charles7c',
+    admin: ['Charles7c'],
     id: md5(page.value.relativePath),
-    language: options.value.language,
-    distractionFreeMode: options.value.distractionFreeMode,
-    proxy: options.value.pagerDirection
+    language: 'zh-CN',
+    distractionFreeMode: false,
+    // 默认: https://cors-anywhere.azm.workers.dev/https://github.com/login/oauth/access_token
+    proxy: 'https://cors-server-charles7c.vercel.app/github_access_token'
   })
 }
 
@@ -41,6 +44,35 @@ if (type.value && type.value == 'gitalk') {
 onMounted(() => {
   if (type.value && type.value == 'gitalk') {
     gitalk.render('comment-container')
+
+    // 如果点赞，先判断有没有登录
+    let $gc = $('#comment-container');
+    $gc.on('click', '.gt-comment-like', function () {
+      if (!localStorage.getItem('GT_ACCESS_TOKEN')) {
+        Message.warning({
+          content:'点赞前，请您先进行登录',
+          closable: true
+        })
+ 
+        return false
+      }
+      return true
+    })
+    // 提交评论后输入框高度没有重置bug
+    $gc.on('click', '.gt-header-controls .gt-btn-public', function () {
+      let $gt = $('.gt-header-textarea')
+      $gt.css('height', '72px')
+    })
+    // 点击预览时，隐藏评论按钮
+    $gc.on('click', '.gt-header-controls .gt-btn-preview', function () {
+      let pl = $('.gt-header-controls .gt-btn-public');
+      if (pl.hasClass('hide')) {
+        pl.removeClass('hide')
+      } else {
+        // 隐藏
+        pl.addClass('hide')
+      }
+    })
   }
 })
 </script>

docs/.vitepress/theme/components/Tag.vue

@@ -60,8 +60,8 @@
 <script lang="ts" setup>
 import { computed, ref, onMounted } from 'vue'
 import md5 from 'blueimp-md5'
-import articleData from '../../../../../article-data.json'
-import { formatDate, getQueryParam } from '../../utils.ts'
+import articleData from '../../../../article-data.json'
+import { formatDate, getQueryParam } from '../utils.ts'
 
 const tags = computed(() => initTags(articleData))
 /**

docs/.vitepress/theme/index.ts

@@ -1,15 +1,11 @@
 import DefaultTheme from 'vitepress/theme'
-import MyLayout from "./MyLayout.vue"
+import MyLayout from './MyLayout.vue'
 import './styles/vars.css'
 import './styles/custom.css'
-import ArticleMetadata from './components/ArticleMetadata.vue'
-import WordCloud from './components/WordCloud.vue'
 
 export default {
   ...DefaultTheme,
   Layout: MyLayout,
   enhanceApp({ app }) {
-    app.component('ArticleMetadata', ArticleMetadata)
-    app.component('WordCloud', WordCloud)
   }
 }

docs/vite.config.js

@@ -4,7 +4,7 @@ import { ArcoResolver } from 'unplugin-vue-components/resolvers'
 export default {
   plugins: [
     Components({
-      dirs: ['.vitepress/theme/components/dynamic'],
+      dirs: ['.vitepress/theme/components'],
       include: [/\.vue$/, /\.md$/],
       resolvers: [ArcoResolver({ sideEffect: true, resolveIcons: true })]
     })

package.json

@@ -11,19 +11,20 @@
     "serve": "vitepress serve docs"
   },
   "devDependencies": {
+    "unplugin-vue-components": "0.22.0",
+    "vitepress": "^1.0.0-alpha.4",
+    "vue": "^3.2.37"
+  },
+  "dependencies": {
     "@antv/g2plot": "^2.4.20",
     "@arco-design/web-vue": "^2.35.0",
     "@pureadmin/utils": "^0.0.33",
     "blueimp-md5": "^2.19.0",
     "dayjs": "^1.11.4",
     "fast-glob": "^3.2.11",
+    "gitalk": "^1.7.2",
     "gray-matter": "^4.0.3",
-    "unplugin-vue-components": "0.22.0",
-    "vitepress": "^1.0.0-alpha.4",
-    "vue": "^3.2.37"
-  },
-  "dependencies": {
-    "gitalk": "^1.7.2"
+    "jquery": "^3.6.0"
   },
   "keywords": [
     "blog",

yarn.lock

@@ -1431,6 +1431,11 @@ is-weakref@^1.0.2:
   dependencies:
     call-bind "^1.0.2"
 
+jquery@^3.6.0:
+  version "3.6.0"
+  resolved "https://registry.npmjs.org/jquery/-/jquery-3.6.0.tgz#c72a09f15c1bdce142f49dbf1170bdf8adac2470"
+  integrity sha512-JVzAR/AjBvVt2BmYhxRCSYysDsPcssdmTFnzyLEts9qNwmjmu4JTAMYubEfwVOSwpQ1I1sKKFcxhZCI2buerfw==
+
 "js-tokens@^3.0.0 || ^4.0.0":
   version "4.0.0"
   resolved "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz#19203fb59991df98e3a287050d4647cdeaf32499"