发现在VPS上部署Hexo博客看着太麻烦了,还是本地配合Github搞吧,这样既不失装B还能超低成本有自己的一个博客,不用自己出服务器钱,不用担心被攻击,如果你不要独立域名直接就是0成本! 在dalao界Hexo博客一直令我等鶸膜拜,在网上找了很多资料后终于搞定了Hexo的博客,以后也可以装B去了。不过你要是不差钱,就是个小白还是用WP吧,这玩意用着其实挺别扭的。。。 一、Windows 10上的部署本次以比较流行的Win10为例,Win7、8也差不多,XP直接打死。 1.安装GitGit是上传到Github的工具,如果在Github上有项目都会用到这个。 下载:https:///download/win 选择对应系统的版本即可,一路下一步,记住选择几个功能,这样操作更像是在Linux Shell里操作。 Use Git from Bash only 、Checkout Windows-style,commit Unix-style line endings 、Use MinTTY(the default terminal of MSYS2)
2.配置Git安装好后需要几行命令说清楚你是谁,这样才能认对人。自行替换自己的用户名和邮箱。 | git config --global user.name "Your Name" git config --global user.email "email@example.com" |
3.生成密钥文件这个操作加密你的通信过程,同时后期上传到Github都会用到。 | ssh-keygen -t rsa -b 4096 -C "email@example.com" |
按3次回车,全部无视,证书文件会在C:\User\用户名\.ssh 生成两个文件。 4.安装NodeJS去官网下载NodeJS Windows版本,建议选择LTS版本,https:///en/,安装的时候务必选择Add to PATH选项。 5.安装Hexo在Git程序里运行命令行即可安装 至此在Win上的部署安装已经完成,接下来就是如何使用了。 二、Hexo的使用1.新建站点假设代码存放在D:\hexo\blog | cd /d mkdir hexo cd hexo hexo init blog cd blog npm install |
在D:\hexo\blog 里就能看到所有文件了,下面是文件说明: 目录名称 | 说明 |
---|
scaffolds | 模版 文件夹。当您新建文章时,Hexo 会根据 scaffold 来建立文件。 Hexo的模板是指在新建的markdown文件中默认填充的内容。例如,如果您修改scaffold/post.md中的Front-matter内容,那么每次新建一篇文章时都会包含这个修改。 | source | 资源文件夹是存放用户资源的地方。除 _posts 文件夹之外,开头命名为 _ (下划线)的文件 / 文件夹和隐藏的文件将会被忽略。Markdown 和 HTML 文件会被解析并放到 public 文件夹,而其他文件会被拷贝过去。 | themes | 主题 文件夹。Hexo 会根据主题来生成静态页面。 | _config.yml | 网站的 配置 信息,您可以在此配置大部分的参数。 | package.json | 应用程序的信息。EJS, Stylus 和 Markdown renderer 已默认安装,您可以自由移除。 |
2.Hexo的配置(1)替换主题推荐NexT主题,这是一款知名的Hexo主题,非常漂亮简洁。 | cd /d/hexo/blog git clone https://github.com/iissnan/hexo-theme-next themes/next |
回到根目录,找到_config.yml 文件,在第66行的theme字段里把默认主题名字换成next即可。 (2)插入图片Markdown 支持插入本地图片或外部链接图片,要保证本地和网络上都能访问图片,使用hexo-asset-image
| # 安装插件 npm install https://github.com/CodeFalling/hexo-asset-image --save 启用插件,确保主题配置文件D:\hexo\blog\_config.yml中 post_asset_folder: true # 新增博文后,会在D:\hexo\blog\source\_posts目录下生成 xxx.md 和 xxx 目录,将图片存放该目录中,使用时 ,这样Typora预览和发布到网上时Hexo博客都能正常显示图片 |
3.新建博文在目录D:\hexo\blog\source\_posts 下会生成Markdown文件Hello World.md 手动添加Markdown 文件到D:\hexo\blog\source\_posts 目录效果一样 4.本地预览如果以后修改了主题和写了一篇新文章都可以使用这个方法在本地查看,解决BUG。 | cd /d/hexo/blog # 生成静态文件 hexo generate # 启动本地服务器 hexo server --debug |
打开浏览器,输入http://localhost:4000 即可看到站点的预览了。 提醒一点,生成静态化可以使用简化命令 在后面的上传到Github中,如果你发现明明写了一篇文章,但是网站却没有?那么一定是MD的语法有问题,生成静态化文件的时候就会报错,务必检查一下哪里出问题,修复后才能成功上传和展现文章。 三、配置Github Pages或Coding PagesGithub比较出名些,Coding是国内的平台,和Github基本差不多,如果担心访问速度或者其他原因可以选择国内的。 Github的配置方法1.注册并登录Github账号。新建一个仓库,建好后可以在仓库首页的Setting里修改为:yourname. 2.添加SSH KEY点击Github右上角的头像,有个Setting,找到SSH and GPG keys,新建一个New keys,随便起名,把密钥内容复制进去。密钥是啥?就是最开始生成的那个密钥,id_rsa.pub文件。 3.测试SSH连接在本地的Git中执行, 如果出现Hi username! You've successfully authenticated, but GitHub does not provide shell access. 提示,则表示连接成功。如果不行就重新生成一个密钥再重新上传密钥试试。 Coding中的配置方法Github免费用户只能新建公开的代码仓库,而且是国外的服务器,而Coding可以新建私有代码仓库,国内用户访问速度更快。注册Coding,添加项目,项目名称为Coding用户名 ,分支选择master ,同时还需要在D:\hexo\blog\source 目录下创建一个空白文件Staticfile : | cd /d/hexo/blog/source touch Staticfile |
添加SSH keyshttps:///help/doc/git/ssh-key.html 在Coding 账户 中找到SSH 公钥 ,新增公钥,复制公钥文件id_rsa.pub 中的内容 测试SSH连接在Git Bash 中执行: 如果出现Hello username! You have connected to Coding.net by SSH successfully! 提示,则表示连接成功。 四、部署你的博客注意站点配置文件D:\hexo\blog\_config.yml 中deploy 参数配置如下: | # Deployment ## Docs: https:///docs/deployment.html deploy: type: git repo: github: git@github.com:zrj766/zrj766..git,master coding: git@git.:zrj766/zrj766.git,master |
在本地Git中执行: | # git方式需要先安装插件 npm install hexo-deployer-git --save # 上传代码到仓库 hexo clean && hexo generate && hexo deploy 或者: hexo clean && hexo generate -d |
如果出现INFO Deploy done: git 提示,则表示部署成功。访问用户名. 和用户名.coding.me 都可以正常打开博客了。 五、独立域名绑定用个二级域名总是不爽,何况现在主流域名都不贵,现在来绑定自己的域名。 1.DNS解析www和@记录做CNAME解析到 用户名. 如果使用的是Coding同样的方法解析到 pages.coding.me 2.Hexo上的设置域名绑定Github在D:\hexo\blog\source 目录下新建一个文件CNAME ,内容为要绑定的域名: 文件去掉格式,直接空白 | www.example.com example.com |
域名绑定Coding Pages在Coding网站中进入刚新建的项目,依次单击代码 、Pages服务 自定义域名: 重新部署一次代码即可。 六、其他辅助工具Markdown书写工具推荐Typora,介绍文章:http://www./typora.html Markdown渲染插件推荐Markdown Here 图床由于markdown要导入网络图片才能让本地用户和网络用户都能正常访问图片,而且像有道云笔记这种还不能支持插入图片,所以要借助图床和快捷插入图片的小插件来提高写作效率。 七牛注册七牛,在对象存储 中新建存储空间,要选择公开空间,不然上传图片后无法分享外部链接。 MPic下载MPic-图床神器,设置账号,空间名 为七牛对象存储空间名称,AccessKey 和SecretKey 在七牛个人面板 下的密钥管理 中,域名 为七牛对象存储空间中内容管理 页签下的外链默认域名。 七、扩展阅读推荐一些文章可以帮助你更快的学习使用和解决问题 Hexo 入门指南(三) – 文章 & 草稿 搭建Hexo博客中碰到的坑 八、参考文章本篇文章的写成参考了以下文章,感谢原作者的奉献! Win10搭建hexo-Github-Coding博客 搭建Hexo博客中碰到的坑 九、总结Hexo这种静态化博客真是轻快,打开速度飞快,比臃肿的WP强了很多。不过因为没有后台之类的东西所以新建文章等操作需要手动操作,不过Hexo的可塑性还是不错的,流行的MD语法,还有文件在本地都可以自由修改,只要懂得一些代码知识就能打造自己的站点。加上配合Github、Coding的使用,完全可以做到0成本拥有自己的博客。如果你对他感兴趣就一起来部署拥有自己的第一个博客吧! 原创文章,作者:zrj766,如若转载,请注明出处:https://www./post-471.html
|