• 全局安装pnpm，执行npm install -g pnpm
• 克隆代码到本地，访问：https://github.com/hoppscotch/hoppscotch
• 拷贝一份.env.example，重命名为.env，内容不用变

• 执行pnpm install
• 执行pnpm run dev
• 控制台打印如下：

• 首先需要购买一台云服务器，阿里云上购买一台ecs即可
• 登录服务器，安装nginx

域名购买

• 访问阿里云域名产品，地址：https://dc.console.aliyun.com/next/index?spm=5176.8351553.products-recent.ddomain.4ef81991mqNaQQ#/overview
• 搜索自己想买的域名地址，查看是否已经有人购买，例如：hfwas.tech

创建证书

• 访问阿里云数字证书管理服务，地址：https://yundun.console.aliyun.com/?spm=a2c1d.8251892.products-recent.dcas.11b35b76rbhoR7&p=cas#/certExtend/free/cn-hangzhou

现象

• 本地vuepress-theme-hope模版项目启动之后，浏览器出现以下报错，截图如下：

解决办法

• 项目根目录下执行npx vp-update ,具体效果如下：

• 再次访问前端页面，没有问题了
• 问题解决！

接入过程

• 参考waline的中文文档快速上手，按照文档就可以正常接入
• 这里我吧自己接入waline的过程写成文档记录一下
• 首先访问waline快速接入文档：https://waline.js.org/guide/get-started/
• 访问国际版leancloud，注册账号。

• 提前准备好后缀名称为pem和key的文件，
• 上传到服务器nginx对应目录下，我这边新建了一个cert文件夹放置

• 在nginx配置文件当中增加一个location，主要是ssl_certificate和ssl_certificate_key两个参数，参考以下写法：

• 前置知识：
  • 使用主题vuepress-theme-hope

博客主页

• 自定义生成的demo下的src目录下的README决定了博客主页的效果图
• 具体参考以下内容：测试

---
home: true
layout: BlogHome
icon: home
title: 博客主页
heroImage: /assets/icon/guide-maskable.png
heroText: HFwas
heroFullScreen: false
tagline: Java开发，熟悉运维知识，会点前端
projects:
  - icon: project
    name: 编程语言
    desc: Java,Vue,React等
    link: https://你的项目链接

  - icon: project
    name: 框架类
    desc: Spring家族
    link: https://链接地址

  - icon: project
    name: 组件类
    desc: 三方组件
    link: https://你的书籍链接

  - icon: project
    name: 运维相关
    desc: Linux,Shell等
    link: https://你的文章链接

---