vitepress-plugin-artalk 0.1.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2020 sugar
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,79 @@
+# vitepress-plugin-artalk
+
+[English](https://github.com/ATQQ/sugar-blog/blob/master/packages/vitepress-plugin-artalk/README-en.md) | 简体中文
+
+VitePress 评论组件插件，集成了 [Artalk](https://artalk.js.org/) 评论系统，并包含了一个悬浮的评论跳转按钮（带移动端适配）。
+
+![示例](https://github.com/ATQQ/sugar-blog/blob/master/packages/vitepress-plugin-artalk/image.png?raw=true)
+
+## 安装
+
+```bash
+pnpm add vitepress-plugin-artalk artalk
+```
+
+## 使用
+
+在 `.vitepress/config.ts` 中引入插件：
+
+```ts
+import { defineConfig } from 'vitepress'
+import { artalkPlugin } from 'vitepress-plugin-artalk'
+
+export default defineConfig({
+  vite: {
+    plugins: [
+      artalkPlugin({
+        site: 'site-name',
+        server: 'https://your-artalk-server.com',
+        // ...其他配置
+      })
+    ]
+  }
+})
+```
+
+## Frontmatter 配置
+
+你也可以在单篇文章的 `frontmatter` 中动态覆盖或关闭评论配置：
+
+```yaml
+---
+# 关闭评论
+comment: false
+---
+
+---
+# 覆盖评论配置
+comment:
+  label: 热评
+  mobileMinify: false
+---
+```
+
+## 选项
+
+继承自 Artalk 的配置，同时包含以下插件独有配置：
+
+| 参数 | 说明 | 类型 | 默认值 |
+| --- | --- | --- | --- |
+| site | 站点名称 | `string` | **必填** |
+| server | Artalk 服务器地址 | `string` | **必填** |
+| showCommentBtn | 是否显示右下角悬浮评论跳转按钮 | `boolean` | `true` |
+| label | 悬浮按钮旁边的文字提示 | `string` | `'评论'` |
+| mobileMinify | 移动端下是否隐藏文字提示仅显示图标 | `boolean` | `true` |
+| icon | 自定义 SVG 图标代码 | `string` | - |
+
+## 类型定义
+
+```ts
+export interface ArtalkPluginOptions {
+  site: string
+  server: string
+  mobileMinify?: boolean
+  label?: string
+  icon?: string
+  showCommentBtn?: boolean
+  [key: string]: any
+}
+```

package/dist/components/ArtalkComment.vue

@@ -0,0 +1,187 @@
+<script setup lang="ts">
+import { useData, useRoute } from 'vitepress'
+import { computed, onMounted, onUnmounted, ref, watch } from 'vue'
+import type Artalk from 'artalk'
+
+// @ts-expect-error
+import pluginOptions from 'virtual:artalk-plugin-options'
+import { useElementSize, useElementVisibility, useWindowSize } from '@vueuse/core'
+import Icon from './Icon.vue'
+
+const { frontmatter, isDark, page } = useData()
+
+const commentConfig = computed(() => {
+  // If explicitly disabled in frontmatter
+  if (frontmatter.value.comment === false) {
+    return false
+  }
+
+  // Merge frontmatter config if available, otherwise use plugin options
+  const fmConfig = frontmatter.value.comment
+  if (typeof fmConfig === 'object') {
+    return { ...pluginOptions, ...fmConfig }
+  }
+
+  return pluginOptions
+})
+
+const route = useRoute()
+const artalk = ref<Artalk>()
+const artalkContainer = ref<HTMLDivElement>()
+
+function initArtalk() {
+  // CDN 异步加载，有优化空间
+  const observer = new MutationObserver((mutationsList, observer) => {
+    // @ts-expect-error
+    if (window.Artalk && commentConfig.value && artalkContainer.value) {
+      // @ts-expect-error
+      artalk.value = window.Artalk.init({
+        el: artalkContainer.value,
+        darkMode: isDark.value,
+        pageKey: route.path,
+        pageTitle: page.value.title,
+        server: commentConfig.value?.server,
+        site: commentConfig.value?.site,
+        ...commentConfig.value
+      })
+      observer.disconnect()
+    }
+  })
+
+  observer.observe(document.head, { subtree: true, childList: true, attributes: true, attributeFilter: ['id'] })
+}
+
+watch(() => route.path, () => {
+  if (artalk.value) {
+    artalk.value.update({
+      pageKey: route.path,
+      pageTitle: page.value.title,
+    })
+    artalk.value.reload()
+  }
+})
+
+onUnmounted(() => {
+  if (artalk.value) {
+    artalk.value.destroy()
+  }
+})
+
+watch(isDark, () => {
+  if (artalk.value) {
+    artalk.value.setDarkMode(isDark.value)
+  }
+})
+
+// Wrapper logic
+const commentEl = ref(null)
+const commentIsVisible = useElementVisibility(commentEl)
+
+function handleScrollToComment() {
+  // @ts-expect-error
+  commentEl.value?.scrollIntoView({
+    behavior: 'smooth',
+    block: 'start'
+  })
+}
+
+const { width } = useWindowSize()
+const mobileMinify = computed(() => width.value < 768 && (commentConfig.value?.mobileMinify ?? true))
+
+const $vpDoc = typeof document !== 'undefined' ? document.querySelector('.vp-doc') || document.body : null
+const el = ref<any>($vpDoc)
+const { width: _docWidth } = useElementSize(el)
+const docWidth = computed(() => `${_docWidth.value}px`)
+
+onMounted(() => {
+  const vpDoc = document.querySelector('.vp-doc')
+  if (vpDoc) {
+    el.value = vpDoc
+  }
+  initArtalk()
+})
+
+const labelText = computed(() => {
+  return commentConfig.value?.label ?? '评论'
+})
+
+const showCommentBtn = computed(() => {
+  return commentConfig.value?.showCommentBtn ?? true
+})
+</script>
+
+<template>
+  <div v-if="commentConfig" id="blog-comment-wrapper" ref="commentEl" class="blog-comment-wrapper" data-pagefind-ignore="all">
+    <div ref="artalkContainer" class="artalk-container" />
+    <div v-if="showCommentBtn && _docWidth" v-show="!commentIsVisible" class="comment-btn-wrapper">
+      <span v-if="!mobileMinify && labelText" class="icon-wrapper-text" @click="handleScrollToComment">
+        <Icon :size="20" :icon="commentConfig?.icon">
+          <svg data-v-f0aeb853="" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 1024 1024"><path fill="currentColor" d="M736 504a56 56 0 1 1 0-112 56 56 0 0 1 0 112m-224 0a56 56 0 1 1 0-112 56 56 0 0 1 0 112m-224 0a56 56 0 1 1 0-112 56 56 0 0 1 0 112M128 128v640h192v160l224-160h352V128z" /></svg>
+        </Icon>
+        <span class="text">
+          {{ labelText }}
+        </span>
+      </span>
+      <span v-else class="icon-wrapper" @click="handleScrollToComment">
+        <Icon :size="20" :icon="commentConfig?.icon">
+          <svg data-v-f0aeb853="" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 1024 1024"><path fill="currentColor" d="M736 504a56 56 0 1 1 0-112 56 56 0 0 1 0 112m-224 0a56 56 0 1 1 0-112 56 56 0 0 1 0 112M128 128v640h192v160l224-160h352V128z" /></svg>
+        </Icon>
+      </span>
+    </div>
+  </div>
+</template>
+
+<style scoped>
+.artalk-container {
+  --at-color-main: var(--vp-c-brand-2);
+}
+.comment-btn-wrapper {
+  position: fixed;
+  width: v-bind(docWidth);
+  text-align: right;
+  bottom: 40px;
+  font-size: 16px;
+  transition: all 0.3s ease-in-out;
+  opacity: 0.6;
+  display: flex;
+  justify-content: right;
+  z-index: 200;
+}
+.comment-btn-wrapper:hover {
+  opacity: 1;
+}
+.comment-btn-wrapper .icon-wrapper,
+.comment-btn-wrapper .icon-wrapper-text {
+  cursor: pointer;
+  border-radius: 50%;
+  position: relative;
+  right: -80px;
+  background-color: var(--vp-c-bg);
+  box-shadow: var(--box-shadow);
+  padding: 4px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background-color: var(--vp-c-brand-soft);
+  color: var(--vp-c-brand-1);
+}
+.comment-btn-wrapper .icon-wrapper:hover,
+.comment-btn-wrapper .icon-wrapper-text:hover {
+  box-shadow: var(--box-shadow-hover);
+}
+.comment-btn-wrapper .icon-wrapper-text {
+  border-radius: 2px;
+  padding: 2px 6px;
+}
+.comment-btn-wrapper .icon-wrapper-text span.text {
+  font-size: 12px;
+  margin-left: 4px;
+}
+
+@media screen and (max-width: 1200px) {
+  .comment-btn-wrapper .icon-wrapper,
+  .comment-btn-wrapper .icon-wrapper-text {
+    position: static;
+  }
+}
+</style>

package/dist/components/Icon.vue

@@ -0,0 +1,33 @@
+<script lang="ts" setup>
+import { computed } from 'vue'
+
+const props = defineProps<{
+  size?: string | number
+  icon?: string
+}>()
+
+const size = computed(() => props.size && (typeof props.size === 'number' ? `${props.size}px` : props.size))
+</script>
+
+<template>
+  <i v-if="props.icon" class="sugar-theme-icon" :style="{ fontSize: size }" v-html="props.icon" />
+  <i v-else class="sugar-theme-icon" :style="{ fontSize: size }">
+    <slot />
+  </i>
+</template>
+
+<style lang="css" scoped>
+.sugar-theme-icon {
+    --color: inherit;
+    align-items: center;
+    display: inline-flex;
+    height: 1em;
+    justify-content: center;
+    line-height: 1em;
+    position: relative;
+    width: 1em;
+    fill: currentColor;
+    color: var(--color);
+    font-size: inherit;
+}
+</style>

package/dist/components/style.css

@@ -0,0 +1,15 @@
+/* TODO：按实际情况添加不同模式的变量 */
+html .demo {
+    --box-shadow: 0 1px 8px 0 rgba(0, 0, 0, 0.1);
+}
+
+html.dark .demo {
+    --box-shadow: 0 1px 8px 0 rgba(0, 0, 0, 0.6);
+}
+
+.parent-demo{
+    text-align: center;
+}
+.parent-demo h1{
+    color: red;
+}

package/dist/components/util.d.ts

@@ -0,0 +1,3 @@
+export declare function parseStringStyle(cssText: string): Record<string, string | number>;
+export declare function useDebounceFn<T extends (...args: any[]) => any>(fn: T, delay: number): (...args: any[]) => void;
+export declare const inBrowser: boolean;

package/dist/components/util.js

@@ -0,0 +1,23 @@
+const listDelimiterRE = /;(?![^(]*\))/g;
+const propertyDelimiterRE = /:([^]+)/;
+const styleCommentRE = /\/\*[^]*?\*\//g;
+export function parseStringStyle(cssText) {
+    const ret = {};
+    cssText.replace(styleCommentRE, '').split(listDelimiterRE).forEach((item) => {
+        if (item) {
+            const tmp = item.split(propertyDelimiterRE);
+            tmp.length > 1 && (ret[tmp[0].trim()] = tmp[1].trim());
+        }
+    });
+    return ret;
+}
+export function useDebounceFn(fn, delay) {
+    let timer;
+    return (...args) => {
+        clearTimeout(timer);
+        timer = setTimeout(() => {
+            fn(...args);
+        }, delay);
+    };
+}
+export const inBrowser = typeof document !== 'undefined';

package/dist/components/util.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"util.js","sourceRoot":"","sources":["../../src/components/util.ts"],"names":[],"mappings":"AAAA,MAAM,eAAe,GAAG,eAAe,CAAA;AACvC,MAAM,mBAAmB,GAAG,SAAS,CAAA;AACrC,MAAM,cAAc,GAAG,gBAAgB,CAAA;AAEvC,MAAM,UAAU,gBAAgB,CAAC,OAAe;IAC9C,MAAM,GAAG,GAAoC,EAAE,CAAA;IAC/C,OAAO,CAAC,OAAO,CAAC,cAAc,EAAE,EAAE,CAAC,CAAC,KAAK,CAAC,eAAe,CAAC,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,EAAE;QAC1E,IAAI,IAAI,EAAE,CAAC;YACT,MAAM,GAAG,GAAG,IAAI,CAAC,KAAK,CAAC,mBAAmB,CAAC,CAAA;YAC3C,GAAG,CAAC,MAAM,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC,GAAG,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC,CAAA;QACxD,CAAC;IACH,CAAC,CAAC,CAAA;IACF,OAAO,GAAG,CAAA;AACZ,CAAC;AAED,MAAM,UAAU,aAAa,CAAoC,EAAK,EAAE,KAAa;IACnF,IAAI,KAAU,CAAA;IACd,OAAO,CAAC,GAAG,IAAW,EAAE,EAAE;QACxB,YAAY,CAAC,KAAK,CAAC,CAAA;QACnB,KAAK,GAAG,UAAU,CAAC,GAAG,EAAE;YACtB,EAAE,CAAC,GAAG,IAAI,CAAC,CAAA;QACb,CAAC,EAAE,KAAK,CAAC,CAAA;IACX,CAAC,CAAA;AACH,CAAC;AAED,MAAM,CAAC,MAAM,SAAS,GAAG,OAAO,QAAQ,KAAK,WAAW,CAAA"}

package/dist/index.d.mts

@@ -0,0 +1,15 @@
+import { PluginOption } from 'vite';
+
+interface ArtalkPluginOptions {
+    site: string;
+    server: string;
+    mobileMinify?: boolean;
+    label?: string;
+    icon?: string;
+    showCommentBtn?: boolean;
+    [key: string]: any;
+}
+
+declare function artalkPlugin(options?: ArtalkPluginOptions): PluginOption;
+
+export { ArtalkPluginOptions, artalkPlugin };

package/dist/index.d.ts

@@ -0,0 +1,15 @@
+import { PluginOption } from 'vite';
+
+interface ArtalkPluginOptions {
+    site: string;
+    server: string;
+    mobileMinify?: boolean;
+    label?: string;
+    icon?: string;
+    showCommentBtn?: boolean;
+    [key: string]: any;
+}
+
+declare function artalkPlugin(options?: ArtalkPluginOptions): PluginOption;
+
+export { ArtalkPluginOptions, artalkPlugin };

package/dist/index.js

@@ -0,0 +1,129 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.ts
+var src_exports = {};
+__export(src_exports, {
+  artalkPlugin: () => artalkPlugin
+});
+module.exports = __toCommonJS(src_exports);
+var import_javascript_stringify = require("javascript-stringify");
+
+// src/util.ts
+var import_node_path = __toESM(require("path"));
+var import_node_url = require("url");
+var import_meta = {};
+function isESM() {
+  return typeof __filename === "undefined" || typeof __dirname === "undefined";
+}
+function getDirname() {
+  return isESM() ? import_node_path.default.dirname((0, import_node_url.fileURLToPath)(import_meta.url)) : __dirname;
+}
+
+// src/index.ts
+var componentName = "ArtalkComment";
+var componentFile = `${componentName}.vue`;
+var aliasComponentFile = `${getDirname()}/components/${componentFile}`;
+var virtualModuleId = "virtual:artalk-plugin-options";
+var resolvedVirtualModuleId = `\0${virtualModuleId}`;
+var slots = ["doc-after"];
+function artalkPlugin(options) {
+  const componentOptions = {
+    ...options
+  };
+  let resolveConfig;
+  let vitepressConfig;
+  const pluginOps = {
+    name: "vitepress-plugin-artalk",
+    enforce: "pre",
+    configResolved(config) {
+      if (resolveConfig) {
+        return;
+      }
+      resolveConfig = config;
+      vitepressConfig = config.vitepress;
+      if (!vitepressConfig) {
+        return;
+      }
+      const selfTransformPageData = vitepressConfig.transformPageData;
+      vitepressConfig.transformPageData = async (pageData, ctx) => {
+        pageData.frontmatter.head ??= [];
+        pageData.frontmatter.head.push(...getArtalkScriptHead(options));
+        return selfTransformPageData?.(pageData, ctx);
+      };
+    },
+    config: () => {
+      return {
+        resolve: {
+          alias: {
+            [`./${componentFile}`]: aliasComponentFile
+          }
+        }
+      };
+    },
+    transform(code, id) {
+      if (id.endsWith("vitepress/dist/client/theme-default/Layout.vue")) {
+        let transformResult = code;
+        for (const element of slots) {
+          const slotPosition = `<slot name="${element}" />`;
+          transformResult = transformResult.replace(slotPosition, `${slotPosition}<ClientOnly><${componentName} /></ClientOnly>`);
+        }
+        const setupPosition = '<script setup lang="ts">';
+        transformResult = transformResult.replace(setupPosition, `${setupPosition}
+import ${componentName} from './${componentName}.vue'`);
+        return transformResult;
+      }
+    },
+    resolveId(id) {
+      if (id === virtualModuleId) {
+        return resolvedVirtualModuleId;
+      }
+    },
+    load(id) {
+      if (id === resolvedVirtualModuleId) {
+        return `export default ${(0, import_javascript_stringify.stringify)(componentOptions)}`;
+      }
+    }
+  };
+  return pluginOps;
+}
+function getArtalkScriptHead(options) {
+  if (!options?.server) {
+    return [];
+  }
+  const { server } = options;
+  return [
+    ["link", { href: `${server}/dist/Artalk.css`, rel: "stylesheet" }],
+    ["script", { src: `${server}/dist/Artalk.js`, id: "artalk-script" }]
+  ];
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  artalkPlugin
+});

package/dist/index.mjs

@@ -0,0 +1,93 @@
+// src/index.ts
+import { stringify } from "javascript-stringify";
+
+// src/util.ts
+import path from "node:path";
+import { fileURLToPath } from "node:url";
+function isESM() {
+  return typeof __filename === "undefined" || typeof __dirname === "undefined";
+}
+function getDirname() {
+  return isESM() ? path.dirname(fileURLToPath(import.meta.url)) : __dirname;
+}
+
+// src/index.ts
+var componentName = "ArtalkComment";
+var componentFile = `${componentName}.vue`;
+var aliasComponentFile = `${getDirname()}/components/${componentFile}`;
+var virtualModuleId = "virtual:artalk-plugin-options";
+var resolvedVirtualModuleId = `\0${virtualModuleId}`;
+var slots = ["doc-after"];
+function artalkPlugin(options) {
+  const componentOptions = {
+    ...options
+  };
+  let resolveConfig;
+  let vitepressConfig;
+  const pluginOps = {
+    name: "vitepress-plugin-artalk",
+    enforce: "pre",
+    configResolved(config) {
+      if (resolveConfig) {
+        return;
+      }
+      resolveConfig = config;
+      vitepressConfig = config.vitepress;
+      if (!vitepressConfig) {
+        return;
+      }
+      const selfTransformPageData = vitepressConfig.transformPageData;
+      vitepressConfig.transformPageData = async (pageData, ctx) => {
+        pageData.frontmatter.head ??= [];
+        pageData.frontmatter.head.push(...getArtalkScriptHead(options));
+        return selfTransformPageData?.(pageData, ctx);
+      };
+    },
+    config: () => {
+      return {
+        resolve: {
+          alias: {
+            [`./${componentFile}`]: aliasComponentFile
+          }
+        }
+      };
+    },
+    transform(code, id) {
+      if (id.endsWith("vitepress/dist/client/theme-default/Layout.vue")) {
+        let transformResult = code;
+        for (const element of slots) {
+          const slotPosition = `<slot name="${element}" />`;
+          transformResult = transformResult.replace(slotPosition, `${slotPosition}<ClientOnly><${componentName} /></ClientOnly>`);
+        }
+        const setupPosition = '<script setup lang="ts">';
+        transformResult = transformResult.replace(setupPosition, `${setupPosition}
+import ${componentName} from './${componentName}.vue'`);
+        return transformResult;
+      }
+    },
+    resolveId(id) {
+      if (id === virtualModuleId) {
+        return resolvedVirtualModuleId;
+      }
+    },
+    load(id) {
+      if (id === resolvedVirtualModuleId) {
+        return `export default ${stringify(componentOptions)}`;
+      }
+    }
+  };
+  return pluginOps;
+}
+function getArtalkScriptHead(options) {
+  if (!options?.server) {
+    return [];
+  }
+  const { server } = options;
+  return [
+    ["link", { href: `${server}/dist/Artalk.css`, rel: "stylesheet" }],
+    ["script", { src: `${server}/dist/Artalk.js`, id: "artalk-script" }]
+  ];
+}
+export {
+  artalkPlugin
+};

package/package.json

@@ -0,0 +1,60 @@
+{
+  "name": "vitepress-plugin-artalk",
+  "version": "0.1.0",
+  "description": "vitepress plugin artalk",
+  "author": "sugar",
+  "license": "MIT",
+  "homepage": "https://github.com/ATQQ/sugar-blog/tree/master/packages/vitepress-plugin-artalk",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/ATQQ/sugar-blog.git"
+  },
+  "bugs": {
+    "url": "https://github.com/ATQQ/sugar-blog/issues"
+  },
+  "keywords": [
+    "vitepress",
+    "plugin",
+    "artalk",
+    "comment"
+  ],
+  "exports": {
+    ".": {
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.js"
+    }
+  },
+  "main": "dist/index.js",
+  "module": "dist/index.mjs",
+  "types": "dist/index.d.ts",
+  "files": [
+    "dist"
+  ],
+  "peerDependencies": {
+    "vitepress": "^1 || ^2"
+  },
+  "dependencies": {
+    "@vueuse/core": "^14.1.0",
+    "javascript-stringify": "^2.1.0"
+  },
+  "devDependencies": {
+    "artalk": "^2.8.5",
+    "chokidar": "^3.6.0",
+    "fs-extra": "^11.1.1",
+    "tinyglobby": "^0.2.6",
+    "tsup": " ^7.2.0",
+    "typescript": "^5.5.4",
+    "vite": "^5",
+    "vitepress": "2.0.0-alpha.16",
+    "vue": "^3.5.24"
+  },
+  "scripts": {
+    "dev": "pnpm run /^dev:.*/",
+    "dev:plugin": "npx tsup src/index.ts --dts --watch --format esm,cjs --external vitepress",
+    "dev:component": "tsc --sourcemap -w --preserveWatchOutput -p src/components",
+    "dev:watch": "node scripts/watchAndCopy.mjs",
+    "build": "pnpm run /^build:.*/",
+    "build:plugin": "npx tsup src/index.ts --dts --format esm,cjs --external vitepress --silent",
+    "build:component": "tsc -p src/components && node scripts/copyComponents.mjs"
+  }
+}