前言

本篇文章会从本地(Windows 10)搭建-主题更换-部署阿里云详细步骤,如果在搭建过程中,遇到问题,可以通过博客页脚下的QQ联系我,或者在下面评论留言

一.本地搭建

1.安装前置

1.1安装git

git官网下载最新版本的git即可,因为本地是Windows所以下载Windows版本即可,如下图所示,如果你是x64版本的电脑就下载红色箭头所指的版本,如果你是x32的就下载x32版本的。

下载完毕安装包之后全部next下一步即可


1.2安装node.js

安装hexo博客需要nodejs的支持,需要去nodejs官网下载,下载LTS长期支持版本即可,如下图
我这里的版本是16.13.2LTS

下载完毕之后,直接按照自己需求设置即可,或者直接全部下一步,安装完毕之后,检测安装成功输入如下命令,就可以查看node版本,然后里面还带有npm包管理器也是如下命令查看版本

Windows的建议是,使用cmd用管理员的方式启动
使用windows键 + q输入cmd,鼠标右键以管理员的方式启动

node查看版本

node -v

npm查看版本

npm -v

如下图所示,显示nod版本为v16. 13 .2,npm版本为8. 1. 2


1.3npm换淘宝源

换淘宝源的原因是npm在国外下载速度很卡,淘宝源是国内的就不卡,使用npm下载cnpm来实现换源。

npm下载cnpm命令如下

npm install -g cnpm --registry=https://registry.npm.taobao.org

输入这个命令之后,如下图,第一个红色箭头是安装命令,安装可能会稍微有点久,第二个红色箭头是检查是否安装成功,如果和我显示的一样,没有ERR的报错那么就是安装成功了。


1.4使用cnpm安装hexo博客框架

到这里已经完全安装完毕前置,就可以正式开始安装hexo博客框架,输入如下命令来安装hexo博客框架。

安装博客框架命令

cnpm install -g hexo-cli

输入完如上命令之后如下图,第一个红色箭头是上面的安装博客框架命令,第二个红色箭头是检查是否安装成功,如果你和我一样,那么就是安装成功了。


2.生成hexo博客

2.1准备文件夹

到这里就能真正的安装hexo博客了,首先需要准备一个文件夹比如我这里准备的是blog文件夹来放我的hexo博客,输入命令如下。

准备blog文件夹

cd ..
cd ..
md blog
cd blog

如下图所示按照从上往下的顺序,第一个箭头是回到上级目录,第二个箭头也是回到上级目录,第三个箭头是创建blog文件夹第四个箭头是进入blog文件夹(是不是写的太详细,废话太多了?)

上图是因为我使用的是虚拟机操作,只有一个C盘,所以只能在C盘下操作,这里我选择的是在C盘根目录下面创建blog文件,如果你是真实机,电脑里面应该有D盘F盘等等...什么盘,如果你要在其他盘创建可以输入如下命令

其他盘创建文件夹命令

> 盘符:                 #比如 D:
> md `你要创建的文件夹` #比如 md blog
> cd `你创建的文件夹` #比如 cd blog

2.2生成hexo博客文件

在上面操作的blog文件目录下操作,cmd最好是管理员的方式运行,输入如下命令即可在blog文件夹下面生成hexo博客文件。

生成hexo博客文件

hexo init

因为各种原因,没有在C盘操作了,比如权限问题,下面我都是在虚拟机的E盘操作

然后我遇到了一个问题在这里记录一下,如果你在这个步骤和我遇到了一样的问题也可以参考我的解决办法。如下图报错。

解决办法是找到nodejs的安装目录,右键属性,点击安全,设置users用户完全控制权限

输入完成生成命令之后,可以在生成的目录下面看见这些文件,如下图,后门做博客全部都是基于如下图的文件来修修改改


2.3启动hexo博客

现在什么都做完了,就差启动了,输入如下命令即可启动,前提是必须是在你生成hexo博客的文件夹下面输入如下命令

启动hexo博客

hexo s

输入完成这个命令之后你应该能看见如下图所示的样子

然后就可以根据地址到浏览器去访问,http://localhost:4000/

如下图,成功画面。

我就在这里简单说下hexo的命令用法

启动服务

hexo s

删除缓存

hexo clean

重构文件

hexo g

部署到远程站点

hexo d

在这个页面上面,也详细说明了,怎么创建文章,启动服务,到此,一个基础的hexo博客就已经搭建完毕。


二.更换主题

官方给的主题不太好看怎么办,换主题呗!这里我以Matery主题来做演示,当然你现在看见的这个博客就是用Matery主题来修改的。

1.下载主题

Matery官方文档当然你也可以去官方文档查看,里面有如何修改,配置,当然大多数还是需要自己去修改。

在你的hexo目录下面有一个themes文件夹,cd进去,然后下载matery主题,命令如下

安装matery主题

git clone https://github.com/blinkfox/hexo-theme-matery.git

如下图,如果你和我一样那么就是下载成功了,从上往下,我们先看第二个箭头,第二个箭头是安装matery主题命令,然后下载完毕之后,把themes文件夹里面的主题名字改为matery原名是hexo-theme-matery,这样的好处是方便操作


1.1安装主题

下载完毕之后还需要做配置文件的修改才能生效,首先我们打开hexo博客目录下的_config.yml文件,如下图,从左往右,打开第一个红色箭头所指的_config.yml文件然后,右边的红色箭头是打开文件过后的样子,找到底部theme选项,然后把原本的值修改成matery

如下图查看效果,发现就变好康了很多,这里查看的时候,先ctrl+c停止运行,然后输入hexo clean清理缓存,在然后输入hexo g重构,最后输入hexo s运行服务即可

下一篇文章将是把本地博客部署到阿里云服务器上面

【hexo博客搭建】本地搭建hexo博客(上)的更多相关文章

  1. Hexo搭建博客教程(1) - 安装环境与本地搭建

    前言 搭建个人博客一般有两种选择,一个是使用WordPress,但是需要将博客搭建在服务器上,不过搭建好后写文章方便,适合没有程序基础的人使用.另一个是使用Hexo,相对简洁高效,不需要服务器,既可以 ...

  2. 使用hexo搭建属于自己的博客

    如果你喜欢拥有自己的博客域名,如果你喜欢折腾,可以先点击luckykun.com,看看效果,再选择要不要进来看看--- 之前一直都在博客园写博客,不过最近在逛园子的时候不小心看到了hexo,简直有种相 ...

  3. hexo框架-next主题-github搭建个人博客

    IT`huhui 的前言录 我在GITHUB的个人站点:http://ithuhui.cn 这里遇到的很多问题都是亲身解决后写的.还有遇到不懂可以邮件M我 在这里要感谢浮生志的博客教程,很多我一开始不 ...

  4. 利用Github和Hexo搭建独立的个人博客--基础篇

    利用Github和Hexo搭建独立的个人博客--基础篇 摘要:本文主要参考了使用hexo和Github上创建自己的博客.如何搭建一个独立博客--简明Github Pages与Hexo教程和使用GitH ...

  5. 使用Coding.net+Hexo+node.js+git来搭建个人博客

    使用Coding.net来搭建基于Hexo的博客 一.准备工作 什么是Coding.net Coding可以说,就是国产的Github,但是,有一个功能使它似乎超越了GitHub-那就是 Web ID ...

  6. 搭建自己的hexo博客

    这是我最近用hexo搭建的个人博客,欢迎来参观留言,以下是我创建这个hexo的一步步步骤,欢迎指正! 我的博客 参考自 潘柏信的博客;CnFeat 主题参考这里 pacman; 主题选自这里 hexa ...

  7. 使用Hexo+Github搭建属于自己的博客(基础)

    前言 hexo是一个台湾人做的基于Node.js的静态博客程序,优势是生成静态文件的速度非常快,支持markdown, 我最终选定它的原因是它速度快而且不容易出错,并且可以一键部署到github或者其 ...

  8. 使用Hexo搭建一个简单的博客(一)

    搭建好简洁的博客框架后,回看时发现,简洁之中透露着一丝丝简陋,好的,网上关于丰富hexo的文章也很多 记录一下自己的一些瞎操作. 在你的hexo目录下,你可以看到themes文件夹里有个默认的land ...

  9. 基于Hexo+Node.js+github+coding搭建个人博客——基础篇

    附上个人教程:http://www.ookamiantd.top/2017/build-blog-hexo-base/ 搭建此博客的动机以及好处在此就不多谈了,之前已经表达过,详情请看Start My ...

随机推荐

  1. 描述一下 DispatcherServlet 的工作流程 ?

    DispatcherServlet 的工作流程可以用一幅图来说明: 1.向服务器发送 HTTP 请求,请求被前端控制器 DispatcherServlet 捕获. 2. DispatcherServl ...

  2. java -的字符串hei

    字符串的不可变 String 对象是不可变的.查看 JDK 文档你就会发现,String 类中每一个看起来会修改 String 值的方法,实际上都是创建了一个全新的 String 对象,以包含修改后的 ...

  3. 前后端分离项目部署到Linux虚拟机

    最近做了一个springboot+vue的前后端分离项目,把它部署到Linux虚拟机上.下面是我的步骤和遇到的问题,需要的朋友可以看下(看的时候注意要全部看完到底部,因为我习惯是把我遇到的问题放到最后 ...

  4. 断言工具类之"判断条件不为空"

    1 Assert.notNull(query, AssertConstants.NOT_NULL_MSG);

  5. c++中的赋值函数

    在c++中,对于任意一个类Class A,如果程序员不显示的声明和定义上述函数,C++编译器将会自动的为A产生4个public inline 的默认函数,这4个函数最常见的形式为: A() //默认构 ...

  6. Episode 1:正视微信(试播)

    本期是 WEB VIEW 的第一期播客节目. 「不囿于 WEB,不止于 VIEW」,WEB VIEW 是由 yin 和敬礼主持的一档泛科技播客.节目中我们谨慎考量技术进步所带来的优缺点,提倡用「人治」 ...

  7. mapreduce分区

    本次分区是采用项目垃圾分类的csv文件,按照小于4的分为一个文件,大于等于4的分为一个文件 源代码: PartitionMapper.java: package cn.idcast.partition ...

  8. Android开发 之 理解Handler、Looper、MessageQueue、Thread关系

    本文转自博客:http://blog.csdn.net/he90227/article/details/43567073 一. 图解与概述 首先Android中 的每一个线程都会对应一个Message ...

  9. layui文件上传组件“请求上传接口出现异常”问题解决方案

    这是一个悲伤的故事,以前开发项目用过很多次这个组件,这次使用了Token,于是报了一些莫名其妙的错误,来复盘一下,警示自己! 刚开始接触layui的同学们肯定经常会看到这个错误 下面我们对这个异常的处 ...

  10. JavaScript实现动态表格

    运行效果: 源代码: 1 <!DOCTYPE html> 2 <html lang="zh"> 3 <head> 4 <meta char ...