搭建静态博客网站
常见的静态网站的模板有很多wordpress,vuepress等等,这里使用的是vuepress模板
1.下载修改vuepress模板
我这里是在github上下载的demo模板,直接在它的基础进行修改
下载好之后解压,如果你想要本地运行那么你需要nodejs,我这里使用的是node14.6.0
然后输入以下命令
//安装依赖包
npm install / yarn install
//运行项目
npm run dev
包管理工具有npm,cnpm,yarn,自带的是npm
修改的配置
需要修改的地方只有几个
README.md可以修改一些主页的属性
.vuepress下的config.js 可以修改一些全局配置
在我们就可以写博客在blogs下
docs下的需要在config.js下配置路径
config.js中的侧边栏 参考vuepress
2.上传修改好的模板上传到github
github创建好仓库之后 用git上传就可以了
//首先添加公钥
git init //初始化本地仓库
git add . //添加文件到工作区
git commit -m '' //提交到本地仓库
git remote add origin 'url'
//拉一下合并本地分支
git pull origin master --allow-unrelated-histories //完成时会进入一个文件,直接:wq保存退出即可 需要合并一下仓库
//之后才可以上传push
git push origin master
//强制覆盖远程仓库
git push -f --set-upstream origin master:master
3.部署构建代码到vercel
vercel官网
直接用GitHub账号登录
vercel 创建新项目
选择需要导入的库
配置默认即可
domains那个就给的域名 https://2019xiaoluo-github-io.vercel.app/
4.自己申请域名(也可以直接用vercel的)
设置自己的域名
在我们的域名解析里添加记录
refresh后就可以通过我们的域名访问了
5.总结
侧边栏找了很久 最后发现可以直接搜vuepress
这个用的是1.4版本
文件名不要加空格 会报错
写博客直接写好丢那个blogs中,md文档中修改最上面那些就可以了
我们直接同步到github仓库中,vercel就是自动帮我们更新网站