{
  "name": "halo-comment-normal",
  "version": "1.5.0-alpha.0",
  "private": false,
  "dependencies": {
    "@halo-dev/content-api": "^1.0.0",
    "autosize": "^4.0.4",
    "github-markdown-css": "^5.1.0",
    "marked": "^4.0.12",
    "md5": "^2.3.0",
    "ua-parser-js": "^0.7.31",
    "vue": "^2.6.14",
    "yue.css": "^0.4.0"
  },
  "devDependencies": {
    "@babel/core": "^7.17.8",
    "@babel/eslint-parser": "^7.17.0",
    "@vue/cli-plugin-babel": "~5.0.4",
    "@vue/cli-plugin-eslint": "~5.0.4",
    "@vue/cli-service": "~5.0.4",
    "autoprefixer": "^10.4.4",
    "eslint": "^7.32.0",
    "eslint-config-prettier": "^8.5.0",
    "eslint-plugin-prettier": "^4.0.0",
    "eslint-plugin-vue": "^8.5.0",
    "husky": "^6.0.0",
    "lint-staged": "^10.5.4",
    "postcss": "^8.4.12",
    "prettier": "^2.6.0",
    "sass": "^1.49.9",
    "sass-loader": "^12.6.0",
    "tailwindcss": "^3.0.23",
    "vue-template-compiler": "^2.6.14"
  },
  "browserslist": [
    "> 1%",
    "last 2 versions"
  ],
  "description": "<h1 align=\"center\"><a href=\"https://github.com/halo-dev\" target=\"_blank\">halo-comment-normal</a></h1> > 适用于 Halo 的评论组件。",
  "repository": {
    "type": "git",
    "url": "git+https://github.com/halo-dev/halo-comment-normal.git"
  },
  "author": "Ryan Wang",
  "license": "ISC",
  "bugs": {
    "url": "https://github.com/halo-dev/halo-comment-normal/issues"
  },
  "homepage": "https://github.com/halo-dev/halo-comment-normal#readme",
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "build:wc": "vue-cli-service build --target wc --name halo-comment 'src/components/Comment.vue'",
    "dev:wc": "vue-cli-service build --target wc --name halo-comment 'src/components/Comment.vue' --watch",
    "lint": "vue-cli-service lint"
  },
  "readme": "<h1 align=\"center\"><a href=\"https://github.com/halo-dev\" target=\"_blank\">halo-comment-normal</a></h1>\n\n> 适用于 Halo 的评论组件。\n\n![npm](https://img.shields.io/npm/v/halo-comment-normal?style=flat-square)\n[![](https://data.jsdelivr.com/v1/package/npm/halo-comment-normal/badge)](https://www.jsdelivr.com/package/npm/halo-comment-normal)\n\n### 使用指南\n\n1. 进入后台 -> 系统 -> 博客设置 -> 评论设置\n\n2. 将 `评论模块 JS` 修改为：`https://cdn.jsdelivr.net/npm/halo-comment-normal@1.2.0/dist/halo-comment.min.js`\n\n### 自定义配置\n\n如果你需要自定义该评论组件，下面提供了一些属性：\n\n| 属性           | 说明                     | 默认值                    | 可选                       |\n| -------------- | ------------------------ | ------------------------- | -------------------------- |\n| autoLoad       | 是否自动加载评论列表     | true                      | `true` `false`             |\n| showUserAgent  | 是否显示评论者的 UA 信息 | true                      | `true` `false`             |\n| loadingStyle   | 评论加载样式             | `default`                 | `default` `circle` `balls` |\n\n配置方法：\n\n在引入评论组件的页面加上：\n\n```javascript\n<script>\nvar configs = {\n    autoLoad: true,\n    showUserAgent: true\n}\n</script>\n```\n\n修改评论组件标签加上：\n\n```html\n:configs=\"configs\"\n```\n\n示例：\n\n```html\n<halo-comment id=\"${post.id?c}\" type=\"post\" :configs=\"configs\">\n```\n\n```html\n<halo-comment id=\"${sheet.id?c}\" type=\"sheet\" :configs=\"configs\">\n```\n\n```html\n<halo-comment id=\"${journal.id?c}\" type=\"journal\" :configs=\"configs\">\n```\n\n### 主题开发引用指南\n\n#### 方法一\n\n新建 comment.ftl：\n\n```html\n<#macro comment target,type>\n    <#if !post.disallowComment!false>\n        <script src=\"//cdn.jsdelivr.net/npm/vue@2.6.10/dist/vue.min.js\"></script>\n        <script src=\"${options.comment_internal_plugin_js!'//cdn.jsdelivr.net/npm/halo-comment-normal@1.1.1/dist/halo-comment.min.js'}\"></script>\n        <script>\n        var configs = {\n            autoLoad: true,\n            showUserAgent: true\n        }\n        </script>\n        <halo-comment id=\"${target.id?c}\" type=\"${type}\" :configs=\"configs\"/>\n    </#if>\n</#macro>\n```\n\n然后在 post.ftl/sheet.ftl 中引用：\n\npost.ftl：\n\n```html\n<#include \"comment.ftl\">\n<@comment target=post type=\"post\" />\n```\n\nsheet.ftl：\n\n```html\n<#include \"comment.ftl\">\n<@comment target=sheet type=\"sheet\" />\n```\n\n#### 方法二\n\n一般在主题制作过程中，我们可以将 head 部分抽出来作为宏模板，如：<https://github.com/halo-dev/halo-theme-anatole/blob/master/module/macro.ftl>，那么我们就可以将所需要的依赖放在 head 标签中：\n\n```html\n<head>\n    ...\n    \n    <#if is_post?? && is_sheet??>\n        <script src=\"//cdn.jsdelivr.net/npm/vue@2.6.10/dist/vue.min.js\"></script>\n        <script src=\"${options.comment_internal_plugin_js!'//cdn.jsdelivr.net/npm/halo-comment-normal@1.1.1/dist/halo-comment.min.js'}\"></script>\n        <script>\n        var configs = {\n            autoLoad: true,\n            showUserAgent: true\n        }\n        </script>\n    </#if>\n    \n    ...\n</head>\n```\n\n然后在 post.ftl/sheet.ftl 中引用：\n\npost.ftl：\n\n```html\n<#if !post.disallowComment!false>\n    <halo-comment id=\"${post.id?c}\" type=\"post\" :configs=\"configs\"/>\n</#if>\n```\n\nsheet.ftl：\n\n```html\n<#if !sheet.disallowComment!false>\n    <halo-comment id=\"${sheet.id?c}\" type=\"sheet\" :configs=\"configs\"/>\n</#if>\n```\n\n#### 进阶：\n\n可以将 configs 中的属性通过 settings.yaml 保存数据库中，以供用户自行选择，如：\n\nsettings.yaml：\n\n```yaml\n...\n\ncomment:\n  label: 评论设置\n  items:\n    autoLoad:\n      name: autoLoad\n      label: 自动加载评论\n      type: radio\n      data-type: bool\n      default: true\n      options:\n        - value: true\n          label: 开启\n        - value: false\n          label: 关闭\n    showUserAgent:\n      name: showUserAgent\n      label: 评论者 UA 信息\n      type: radio\n      data-type: bool\n      default: true\n      options:\n        - value: true\n          label: 显示\n        - value: false\n          label: 隐藏\n\n...\n```\n\n那么我们需要将上面的 script 改为下面这种写法：\n\n```javascript\n<script>\nvar configs = {\n    autoLoad: ${settings.autoLoad!},\n    showUserAgent: ${settings.showUserAgent!}\n}\n</script>\n```\n\n#### 说明\n\n1. configs 可以不用配置。\n2. 具体主题开发文档请参考：<https://halo.run/develop/theme/ready.html>。\n\n"
}