Vue如何用vuepress-theme-hope搭建属于自己的博客

涎涎原创约 882 字大约 3 分钟...VueVue

Vue如何用vuepress-theme-hope搭建属于自己的博客

注意

本博文仅供学术研究和交流参考,严禁将其用于商业用途。如因违规使用产生的任何法律问题,使用者需自行负责。

找到官网

  1. 点击如下地址进入官网

vuepress-theme-hopeopen in new window

本地安装启动项目

  1. 本地新建文件夹 vuepress-hope-myblog 并在此文件夹路径下启动cmd或power shell 但不能是git bash 因为需要一个交互式的命令窗口
  1. 运行如下命令
pnpm create vuepress-theme-hope add docs
  1. 在命令窗口向你提问时依次利用键盘的上下键选择
1. 简体中文
2. pnpm
3. 请连续按四个回车
4. y
5. blog
6. y
7. y

配置项目

  1. 更改头部文字以及其配置
  • 如下所示的地方都需要更改
  • 对应需要更改的文件
  1. 放进你写的博客到指定位置且按固定格式以及文件配置

这里我写了一些Java方法处理头部博客文件,可能你用得上open in new window

  1. 配置头部以及侧边栏

  2. 配置搜索框

  3. 配置加密文章

  4. 配置留言评论

  5. 配置github action完成从私有库提交触发提交代码至公库并部署至该库的服务器以及gitee服务器

  • 详细信息请参考我的另一篇博客 Git-GithubAction实现提交代码至私有库自动打包编译提交部署至公开库

项目难点

  1. 上面的3至5条都是官网上写得清清楚楚需要对于官网文档阅读理解即可
  2. 配置留言我用的 vercel 但现在还是有没有申请成功,暂时用的别人配置的
  • 2023年05月17日完成了留言注册,我犯了一个致命的错误,使用了国内的 leancloud 事实证明用国际版的哪有那么多事
  • 有几个注意点
  • 一是 leancloud必须使用国际版本
  • 二是 部署 waline 时的键值对时 键是用官方提供的键 值却必须是 leancloud的值
  • 其它照常做 反正这玩意把我坑不少时间
  1. 第7条需要你有两个库一个私有库放源码一个公开库放打包编译好的代码,且在私有库配置四个变量,在公开库配置允许github action访问的权限,公开库的路径则为你的博客的路径。 相关的参考链接己放入本文的底部

分割线


相关信息

以上就是我关于 Vue如何用vuepress-theme-hope搭建属于自己的博客 知识点的整理与总结的全部内容,希望对你有帮助。。。。。。。

扩展知识

  1. GitHub Actions入门教程-自动部署静态博客open in new window
  2. gitee-pages-actionopen in new window
  3. Hub Mirror Actionopen in new window
  4. GitHub Action: The process '/usr/bin/git' failed with exit code 128open in new window
  5. github-pages-deploy-actionopen in new window
  6. hope主题官网open in new window
  7. Walineopen in new window
  8. 我的博客请参考
  9. leancloud国际版open in new window
  10. waline官网open in new window
上次编辑于:
贡献者: 涎涎
评论
  • 按正序
  • 按倒序
  • 按热度
Powered by Waline v2.15.4