Commit 8dd3d66
Changed files (7)
src
src/components/comment/Waline.astro
@@ -0,0 +1,20 @@
+---
+import { commentConfig } from '@/config';
+import { Waline as WalineComponent } from '@waline/client/component';
+import '@waline/client/meta';
+import '@waline/client/style';
+
+const walineConfig = commentConfig.waline!;
+---
+
+<WalineComponent
+ serverURL={walineConfig.serverURL}
+ path="window.location.pathname"
+ dark={false}
+ meta={walineConfig.meta || ['nick', 'mail', 'link']}
+ requiredMeta={walineConfig.requiredMeta || []}
+ login={walineConfig.login || 'enable'}
+ wordLimit={walineConfig.wordLimit || 500}
+ pageSize={walineConfig.pageSize || 10}
+ reaction={walineConfig.reaction || false}
+/>
src/components/Comment.astro
@@ -2,6 +2,7 @@
import { commentConfig } from '@/config';
import Giscus from '@components/comment/Giscus.astro';
import Twikoo from '@components/comment/Twikoo.astro';
+import Waline from '@components/comment/Waline.astro';
---
<div id="page-comment">
@@ -12,6 +13,8 @@ import Twikoo from '@components/comment/Twikoo.astro';
return <Twikoo />;
case 'giscus':
return <Giscus />;
+ case 'waline':
+ return <Waline />;
}
})()
}
src/types/config.ts
@@ -438,7 +438,7 @@ export type CommentConfig = {
*
* 评论的提供者。
*/
- provider: 'twikoo' | 'giscus';
+ provider: 'twikoo' | 'giscus' | 'waline';
/**
* The configuration of Twikoo.
*
@@ -566,4 +566,75 @@ export type CommentConfig = {
*/
lazyLoad?: boolean;
};
+ /**
+ * The configuration of Waline.
+ *
+ * Waline 的配置。
+ *
+ * @see https://waline.js.org/
+ */
+ waline?: {
+ /**
+ * The server URL of Waline.
+ *
+ * Waline 的服务端地址。
+ *
+ * @see https://waline.js.org/reference/client/props.html#serverurl
+ */
+ serverURL: string;
+ /**
+ * Reviewer attributes of Waline.
+ *
+ * Waline 的评论者相关属性。
+ *
+ * @default ['nick', 'mail', 'link']
+ * @see https://waline.js.org/reference/client/props.html#meta
+ */
+ meta?: ('nick' | 'mail' | 'link')[];
+ /**
+ * Required reviewer attributes of Waline.
+ *
+ * Waline 的评论者必填属性。
+ *
+ * @default []
+ * @see https://waline.js.org/reference/client/props.html#requiredmeta
+ */
+ requiredMeta?: [] | ['nick'] | ['nick', 'mail'];
+ /**
+ * Whether to enable or force to login.
+ *
+ * 是否启用或强制登录。
+ *
+ * @default 'enable'
+ * @see https://waline.js.org/reference/client/props.html#login
+ */
+ login?: 'enable' | 'disable' | 'force';
+ /**
+ * The word limit of the comment.
+ *
+ * 评论的字数限制。
+ *
+ * @default 500
+ * @see https://waline.js.org/reference/client/props.html#wordlimit
+ */
+ wordLimit?: number;
+ /**
+ * The page size of the comments.
+ *
+ * 评论的分页大小。
+ *
+ * @default 10
+ * @see https://waline.js.org/reference/client/props.html#pagesize
+ */
+ pageSize?: number;
+ /**
+ * Whether to enable reactions.
+ *
+ * 是否启用表情。
+ *
+ * @default false
+ * @see https://waline.js.org/reference/client/props.html#reaction
+ */
+ reaction?: boolean | string[];
+ };
};
src/config.ts
@@ -164,8 +164,8 @@ export const searchConfig: SearchConfig = {
};
export const commentConfig: CommentConfig = {
- enable: false,
- provider: 'twikoo',
+ enable: true,
+ provider: 'waline',
twikoo: {
envId: 'your-env-id',
},
@@ -176,4 +176,10 @@ export const commentConfig: CommentConfig = {
categoryId: 'your-category-id',
mapping: 'og:title',
},
+ waline: {
+ serverURL: 'https://astral-halo-comment.netlify.app/.netlify/functions/comment',
+ wordLimit: 100, // Set a lower limit for demo site, to prevent abuse and save free database space cost.
+ pageSize: 10,
+ reaction: false,
+ },
};
astro.config.mjs
@@ -12,6 +12,7 @@ import { wrapCode } from './src/plugins/shiki-transformers.ts';
import { rehypeHeadingIds } from '@astrojs/markdown-remark';
import mdx from '@astrojs/mdx';
import sitemap from '@astrojs/sitemap';
+import vue from '@astrojs/vue';
// import { transformerNotationDiff } from '@shikijs/transformers';
// import { transformerNotationHighlight } from '@shikijs/transformers';
import tailwindcss from '@tailwindcss/vite';
@@ -36,6 +37,7 @@ export default defineConfig({
sitemap({ filter: (page) => !page.includes('/archives/') && !page.includes('/about/') }),
pagefind(),
mdx(),
+ vue(),
],
markdown: {
shikiConfig: {
package.json
@@ -17,6 +17,7 @@
"@astrojs/mdx": "^4.1.0",
"@astrojs/rss": "^4.0.11",
"@astrojs/sitemap": "^3.2.1",
+ "@astrojs/vue": "^5.0.7",
"@iconify-json/ic": "^1.2.2",
"@iconify-json/material-symbols": "^1.2.14",
"@iconify-json/mdi": "^1.2.3",
@@ -29,6 +30,7 @@
"@swup/scripts-plugin": "^2.1.0",
"@swup/scroll-plugin": "^3.3.2",
"@tailwindcss/vite": "^4.0.9",
+ "@waline/client": "^3.5.5",
"astro": "^5.4.1",
"astro-compress": "2.3.5",
"astro-icon": "^1.1.5",
@@ -56,7 +58,8 @@
"swup": "^4.8.1",
"tailwindcss": "^4.0.9",
"typescript": "^5.7.3",
- "unist-util-visit": "^5.0.0"
+ "unist-util-visit": "^5.0.0",
+ "vue": "^3.5.13"
},
"devDependencies": {
"@astrojs/check": "^0.9.4",
tsconfig.json
@@ -11,16 +11,37 @@
}
],
"paths": {
- "@assets/*": ["src/assets/*"],
- "@components/*": ["src/components/*"],
- "@constants/*": ["src/constants/*"],
- "@i18n/*": ["src/i18n/*"],
- "@layouts/*": ["src/layouts/*"],
- "@scripts/*": ["src/scripts/*"],
- "@utils/*": ["src/utils/*"],
- "@/*": ["src/*"]
- }
+ "@assets/*": [
+ "src/assets/*"
+ ],
+ "@components/*": [
+ "src/components/*"
+ ],
+ "@constants/*": [
+ "src/constants/*"
+ ],
+ "@i18n/*": [
+ "src/i18n/*"
+ ],
+ "@layouts/*": [
+ "src/layouts/*"
+ ],
+ "@scripts/*": [
+ "src/scripts/*"
+ ],
+ "@utils/*": [
+ "src/utils/*"
+ ],
+ "@/*": [
+ "src/*"
+ ]
+ },
+ "jsx": "preserve"
},
- "include": ["src/**/*"],
- "exclude": ["dist"]
-}
+ "include": [
+ "src/**/*"
+ ],
+ "exclude": [
+ "dist"
+ ]
+}
\ No newline at end of file