vercel
(补充:vercel在国内已被墙,一个悲伤的消息,网站只能科学上网查看,或者自己绑定域名)
使用vuepress+github托管
我们可以使用vercel进行部署,vercel和github actions很相似,都是通过将博客的所有必须文件(包括package.json,docs等)push到github的某个仓库仓库中,然后在vercel中创建一个项目,导入此仓库,之后的一切就交给vercel去做了 并且vercel还能够自动部署,如果你commit了新的内容,vercel监测到有新的commit之后,便会重新运行npm run build命令进行部署,你只需要将新的修改,从本地push到github便可以了(比如新增一篇文章),而不需要像github pages,服务器部署那样,每次新增文章,都需要在本地运行npm run build,然后再将docs/.vuepress/dist目录中的所有文件,上传到github或者服务器中才能完成博客新内容的改变
而且vercel还自带cdn加速,在速度上比使用通过github pages托管,通过xxx.github.io/xxx访问的速度快,除此以外,还可以自定义域名,可以使用我们自己的域名。
1. 首先就是使用Vue-press 构建自己的博客
vuepress有很多博客主题,https://marketplace.vuejs.press/zh/themes/blog.html
接下使用VuePress Theme Hope来先简单搭建一个博客,官方给出的方式很是简单,只需一行代码,就能构建一个博客
pnpm create vuepress-theme-hope hope-project
经过上面一系列选项,成功构建一个博客项目可以在本地查看
项目目录结构如下图,博客配置在这里就不说了,想要了解具体内容,请前往VuePress Theme Hope,查看具体配置,和使用
此配置的作用就是,运行npm run build命令后,打包后的文件,将会放在dist目录中,默认是docs/.vuepress/dist目录 也可以自己更改目录配置
将项目放在GitHub托管
将项目推送至GitHub,自行完成,
打开vercle官网
使用GitHub登录官网
new Project ,import自己刚刚创建的GitHub仓库
下一步,如下图操作这里的Output Directory 就是上面设置的base,都使用默认配置
点击Deplay,开始部署
等待部署完毕出现 烟花界面,恭喜你成功了!!!
点击continue to Dashboard
自定义域名(也不是太自定义)
设置访问域名
自定义域名这里域名只能以vercel.app结尾,不然就是绑定自己的域名了
修改成juejin123,修改成功!,(juejin已经被占用了)
更新博客
vercel监测到有新的commit之后,便会重新运行npm run build命令进行部署,你只需要将新的修改,从本地push到github便可以了