Hexo搭建个人博客系列二安装Hexo并本地运行访问

1.下载并安装nodejs下载根据自己电脑操作系统的位数到node官网下载相应的版本: https://nodejs.org/en/download/ 根据自己的需要安装到响应的地方,其他的一路点击next即可 配置环境变量选中桌面图标计算机,右键选择属性,打开左边的高级系统设置,打开弹出窗口的环境变量,找到path进行编辑。 找到node.js的安装目录,将其复制后粘贴到path后面。注意每一个加进来的路径后面都要带英文格式的分号。 测试是否安装成功windows+R输入cmd打开命令提示符窗口,输入如下命令: node -v若安装成功会打印出本机安装的node.js的版本。 2.安装和配置hexohexo是基于node.js的静态博客,官网也是搭建在GitHub上。 安装在你喜欢的路径下新建一个文件夹blog,用来存放博客的文件,在此文件夹中右键打开cmd 输入如下指令进行安装: npm install -g hexo-cli如果执行这条命令时长时间未成功,那么请先使用下面的命令将npm镜像源更改为国内的镜像,再执行上面的安装命令,因为国外的镜像源很有可能被墙了。 npm config set registry https://registry.npm.taobao.org初始化hexohexo init hexo这里会将Github上的hexo项目clone下来,得到hexo文件夹。 初始化成功后会在最后打印一行:INFO Start blogging with Hexo! 安装依赖文件进入到hexo文件夹 cd hexo安装依赖文件: cnpm install编译资源,部署形成静态文件: hexo generate执行后,会生成public的文件夹。也就是打包生成好的静态文件存放。 本地测试 hexo serve在浏览器输入:http://localhost:4000/ 即可访问到我们搭建好的hexo站点。 如果端口被占用 可以使用如下命令启动: hexo s -p 50003.总结通过如上简单几步,就可以在本地搭建一个可访问的个人博客。至于里面的文件结构说明会在下一篇去讲。先让程序跑起来,然后在慢慢去深入了解相关概念。

June 17, 2019 · 1 min · jiezi

Hexo搭建个人博客系列一为什么选择Hexo

文/方子龙 一天不码字就剁手的程序猿 1.简介花了几天搭建了个网站,先上链接,欢迎来访:方子龙的个人博客 现在市面上的博客很多,如CSDN,博客园,简书等平台,可以直接在上面发表,用户交互做的好,写的文章百度也能搜索的到。缺点是比较不自由,会受到平台的各种限制和恶心的广告。 而自己购买域名和服务器,搭建博客的成本实在是太高了,不光是说这些购买成本,单单是花力气去自己搭这么一个网站,还要定期的维护它,对于我们大多数人来说,实在是没有这样的精力和时间。 那么就有第三种选择,直接在github page平台上托管我们的博客。这样就可以安心的来写作,又不需要定期维护,而且hexo作为一个快速简洁的博客框架,用它来搭建博客真的非常容易。 我第一次接触Hexo是2018年,我开始是想自己用SpringBoot写一个博客系统,后来在实践的过程中,需要考虑几件事情: 前端页面的实现后端功能的实现数据库的维护服务器的维护考虑购买服务器的费用,还有前端功能的实现,这样的周期就拖得很长,也就没有去实践了。 经过一段时间的收集资料,发现有另外几种方案的实现,Wordpress, Hexo, Jekyll等, 既减少了服务器上的运维,也可以拥有好看的前端效果,而且整个搭建过程也是很简单的。那我们先来看看方案的对比,拓展一下眼界。 2. 方案对比【1】WordPress是什么?引用百度百科 WordPress是使用PHP语言开发的博客平台,用户可以在支持PHP和MySQL数据库的服务器上架设属于自己的网站。WordPress有许多第三方开发的免费模板,安装方式简单易用。WordPress需要会PHP和服务器,所以对于新手来说,还是有门槛的。 【2】Jekyll是什么? 引用自官网:Jekyll 是一个简单的博客形态的静态站点生产机器。它有一个模版目录,其中包含原始文本格式的文档,通过一个转换器(如 Markdown)和我们的 Liquid 渲染器转化成一个完整的可发布的静态网站,你可以发布在任何你喜爱的服务器上。Jekyll 也可以运行在 GitHub Page 上,也就是说,你可以使用 GitHub 的服务来搭建你的项目页面、博客或者网站,而且是完全免费的。Jekyll需要的环境如下: RubyRubyGemsNodeJS或其他 JavaScript 运行环境(如果还没安装NodeJS的,可以参照我写的另一篇文章Mac下安装nvm和NodeJS)Python2.7(或2.7以上版本)看着这些环境,三哥就不想沾染了。 【3】Hexo是什么? Hexo 是一个快速、简洁且高效的博客框架。Hexo 使用 Markdown(或其他渲染引擎)解析文章,在几秒内,即可利用靓丽的主题生成静态网页。Hexo的主题样式也有很多好看的,而且github都有star上万的。说明还是很受欢迎的。Hexo是基于Nodejs,目前也比较火,基于Nodejs搭建的脚手架,对于前后端还是很友好的。Hexo官方中文文档 3. 总结采用Hexo博客框架,来快速搭建属于自己的博客系统,在托管到Pages上去,可以省去服务器维护的时间和精力。

June 17, 2019 · 1 min · jiezi

Hexo功能增强插件

序本文是hexo-enchancer插件的中文版文档.英文版:https://github.com/sisyphsu/h…博文链接: https://sulin.me/2019/Z726F8….介绍hexo-enhancer是一个Hexo功能增强插件。此插件支持的功能较多,并且未来会继续增加,可以理解为插件包。到目前为止,此插件支持的功能如下:自动生成title:根据文件名自动生成标题。自动生成date:根据文件名自动生成日期,具体策略类似Jekyll。自动生成abbrlink:根据标题进行base32和crc32生成短链接。自动生成categories:根据文件的路径解析文章所属分类。自动生成tags:根据配置在_config.yml中的可用tags和keywords自动扫描文章中出现的标签。正常情况下编写的Hexo文章需要在markdown头部手动指定许多属性,例如:—title: Titledate: 2019-03-05categories: [A, B]tags: [tag1, tag2]—# TitleThis is a markdown file, in categories [A, B], with tags [tag1, tag2]. 使用hexo-enhancer插件之后,以上Front-matter完全不需要手动指定:# TitleThis is a markdown file, in categories [A, B], with tags [tag1, tag2].消失的Front-matter完全按照约定规则由hexo-enhancer自动生成,让你可以更加惬意简单地撰写博文。安装npm install hexo-enhancer –save或yarn add hexo-enhancer用法 — date 和title我在使用Hexo之前,曾经用过一段时间Jekyll,抛开整体不谈,个人感觉Jekyll的文件名整合日期和标题的策略挺不错的,使用Hexo之后为了维护Front-matter真的很烦。因此本插件中也实现了类似的文件名策略,即直接将 date + title放在文件名里面,由插件在Hexo编译时动态解析这些属性,整个过程非常简单方便。hexo-enhancer解析文件名的正则表达式如下:/^.?(\d{4})[-]?(\d{2})[-]?(\d{2}).?[-_.@# ](.)$/如果你熟悉正则表达式的话,就知道具体格式多么灵活了,以下所有格式都可以被正确解析:20091010-Title.md2009-10-10_Title.md2009-10-10-Title.md2009/10/10#Title.md2009/10/10@Title.md[20091010]-Title.md【20091010】Title.md「20091010」-Title.mdhexo-enhancer 会将以上文件名全部解析为(最终结果不会回写入.md文件中):—title: Titledate: 2009-10-10—用法 — categorieshexo-enhancer 会将.md文件所在目录及父目录的名称添加入categories属性中,因此你应该按照文章分类放置.md文件,事实上大多数人一直都这么做的。比如 _posts/区块链/比特币/20091010-比特币简介.md 文章将自动获得下面的categories属性:—title: 比特币简介date: 2009-10-10categories: [区块链, 比特币]—用法 — tags我一直认为,文章标签不应该手动维护,因为这样做太麻烦且容易遗漏,最终导致标签非常混乱。正确的做法应该是,将常见的标签关键词全局配置好,然后根据配置好的标签关键词,自动扫描每篇文章包括哪些关键词并生成tags属性。hexo-enhancer的做法就是这样,启动后扫描_config.yml中的keywords与tags属性收集全局标签候选词,然后给每一篇文章自动扫描tags。例如,_config.yml配置的标签可以是这样的:keywords: HTML, JavaScript, Hexotags: Java, Golang, React, Vuehexo-enhancer会扫描您的.md文章,如果文章内出现以上关键词,则自动将其分配如文章的tags属性中。需要特别指出的是,keywords是标准配置,它最终会出现在网页meta中,而tags是自定义的属性,只会被本插件使用。用法 — abbrlinkhexo-enhancer使用 base32(crc32(title)) 算法为每一篇文章分配abbrlink属性,您可以在permlink中使用它们:permalink: :year/:abbrlink.html# permalink: :year/:abbrlink# permalink: posts/:abbrlink.html# permalink: :year/:month/:day/:abbrlink.html使用abbrlink之后,文章的url就会变得非常简洁,例如 https://sulin.me/2018/3055NXV.html有一些插件会根据标题的拼音、翻译生成permlink,但是我感觉这些都不是好的做法。事实上url不宜太长,将一句话放在url中并不一定增强所谓的seo优化,反倒导致其使用起来相当不便。就像许多博客平台一样,为每篇文章分配短小且唯一的url即可,无论是看起来还是用起来都很方便。LicenseMIT ...

March 6, 2019 · 1 min · jiezi