阅读本篇之前,假定读者已经有了Node.js的基础,如需要补充Node.js知识的,请自行百度。

Hexo是在Node.js框架下的一个项目,利用Node.js提供的强大功能,完成从Markdown到静态网页的转换。

NexT是Hexo项目下的一个主题插件,提供可高度定制的页面外观。

欢迎访问博主主页www.Guide2IT.com

Hexo博客专题索引页

1. 我们要做什么

  1. 搭建Node.js环境
  2. 下载Hexo项目
  3. 下载NexT的主题插件
  4. 运行博客

2. 在Windows系统下安装Node.js

在Windows下,Node.js的核心是命令行可执行文件Node.exe。无论安装版或者绿色版,只要满足以下两个基本条件,Hexo即可运行。

  1. node.exe在命令行控制台的当前文件夹,或者可以通过系统环境变量path找到。
  2. Node.js相关的工具包(如npm,实际上是Windows脚本文件npm.cmd)在命令行控制台的当前文件夹或者可以通过系统环境变量path找到。

注意npmNode.js自带的模块包管理工具,跟node.exe位于同一文件夹。Hexo项目也是提供了命令行工具hexo.cmd。这个项目被所有的实例共享,Hexo一般应全局安装。它的hexo.cmd所在文件夹应被放入系统path变量中。

安装Node.js

上面的信息对Windows老司机已经足够。本节余下内容请老司机略过。

  1. 从http://nodejs.cn/download/下载32或64位zip压缩包版本,建议安装长期支持版本。

  2. 把下载包解压缩到你希望安装的文件夹,比如D:\DevelopTools\Nodejs\

  3. 任选下面一种方式把Node.exe的路径放到系统path变量中去。修改path变量后,只有在新打开的命令行窗口中生效。

    • 使用setx命令

      setx PATH "%PATH%;D:\DevelopTools\Nodejs\;" /M

    • 直接修改注册表

      用注册表编辑器打开HKEY_LOCAL_MACHINE\SYSTEM\CurrentControlSet\Control\Session Manager\Environment,在path变量后追加;D:\DevelopTools\Nodejs\;

    • 我的电脑上点击右键,选择属性,选择高级系统设置,选择高级,选择系统变量,在path变量中追加上述路径。

  4. 以下面任意方式设置包的全局安装位置,假设其位置为d:\node_global

    • npm命令npm config set prefix ="d:\node_global"
    • 直接打开C:\Users\Administrator\.npmrc文件,增加或修改其中的prefix=d:\node_global
  5. 参照3的方式把Node.js包的全局安装路径d:\node_global放到系统path变量中去。

  6. 运行node -vnpm -v,显示正常的版本则说明安装完毕。

补充:国内环境下把包的远程服务器设置为淘宝镜像,以加快下载速度。

  • 使用命令行运行npm config set registry=https://registry.npm.taobao.org/
  • 或者,直接修改C:\Users\Administrator\.npmrc文件,增加一行registry=https://registry.npm.taobao.org/

3. 安装或下载Hexo项目

官方推荐采用npm进行安装。

npm install hexo-cli -g

上面的命令会把hexo.cmd安装到全局包仓库中,由于该仓库文件夹在Windows系统的path中。所以你就可以在任意位置执行hexo命令了。

执行一下命令确认hexo安装完好。

hexo -v

该命令会显示hexo的版本及依赖的包。

4. 安装或下载NexT主题插件

通过git指令下载NexT最新的主题文件。

git clone https://github.com/iissnan/hexo-theme-next themes/next

或者,直接从发布页https://github.com/iissnan/hexo-theme-next/releases下载源指定版本源代码。

Assets 2

Source code(zip)

Source code(tar.gz)

下载之后,解压缩主题主题文件,并把它放到themes主题文件

+---public
| +---about
| +---archives
| +---categories
| +---css
| +---images
| +---js
| +---lib
| +---page
| +---post
| \---tags
+---scaffolds
+---source
| +---about
| +---categories
| +---images
| +---tags
| +---_drafts
| \---_posts
\---themes
\---next
+---languages
+---layout
+---scripts
+---source
| +---css
| +---fonts
| +---images
| +---js

在站点配置文件_config.yml里面,找到它

# 原来的值是landscape
theme: next

5. 创建及运行博客

  1. 创建一个空白文件夹,作为博客根目录,在该根目录下,初始化博客

    hexo init
  2. 把主题文件拷贝到博客文件的theme下面

  3. 执行Hexo提供的服务器命令。

    hexo serve

​ 控制台显示:

INFO  Hexo is running at http://localhost:4000 . Press Ctrl+C to stop.

在浏览器地址栏里面输入http://localhost:4000,就可以访问博客了。

重要信息

本文章用到的项目版本

hexo:3.8.0

NexT:5.1.2

Hexo+NexT(一):在Windows下安装Hexo+NexT及搭建博客的更多相关文章

  1. windows下安装hexo和生成博客

    首先在电脑上安装node和git,这个只要在相关官网的下载然后一步安装即可. 然后在你的电脑上新建一个文件夹,用来存放你的博客文件,比如创建hexo 进入该文件,右键打开git bash 安装hexo ...

  2. Windows下安装Redis服务、搭建简单Redis主从复制

    Redis拥有非常强大的主从复制功能,而且还支持一个master可以拥有多个slave,而一个slave又可以拥有多个slave,从而形成强大的多级服务器集群架构.目前在同一台window下安装三个r ...

  3. redis(一)Windows下安装redis服务、搭建redis主从复制

    接下来会写一个redis实战系列,在此记录,有什么问题大家请随时批评. 好了,进入正题,这篇会将redis以windows服务形式提供服务(搭建一个简单的主从复制 M:6379:s:6380.6381 ...

  4. Hexo+NexT(零):最全Hexo+Next搭建博客教程

    快速.简洁且高效的博客框架 有位大神说,喜欢写博客的人的人,折腾博客会经历三个阶段.找到一个免费空间,搭建一个博客,很欣喜,很有成就感,此为一阶段:受限免费空间各种限制,自己买空间和域名,实现对博客的 ...

  5. 在Windows下使用Hexo+GithubPage搭建博客的过程

    1.安装Node.js 下载地址:传送门 去 node.js 官网下载相应版本,进行安装即可. 可以通过node -v的命令来测试NodeJS是否安装成功 2.安装Git 下载地址:传送门 去 Git ...

  6. 个人建站&mac下安装hexo

    title: 个人建站&mac下安装hexo date: 2018-04-18 16:34:02 tags: [mac,blog,个人建站,markdown] --- 这两天使用了markdo ...

  7. 在windows下安装gulp —— 基于 Gulp 的前端集成解决方案(一)

    相关连接导航 在windows下安装gulp —— 基于 Gulp 的前端集成解决方案(一) 执行 $Gulp 时发生了什么 —— 基于 Gulp 的前端集成解决方案(二) 常用 Gulp 插件汇总 ...

  8. Windows 下安装 MongoDB

    Windows 下安装 MongoDB 的步骤:1.官网www.mongodb.com下载安装包或zip包2.解压下载的文件到文件夹 D:\mongo .3.使用管理员权限打开CMD,导航到目录 D: ...

  9. Coreseek Windows下安装调试

    由于项目需要全文检索,后面就去网上查了下资料,找到了Sphinx[中文是狮身人面像]这个全文检索引擎,听说挺好用的,不过没有中文分词.后面又去找了一下,找到了Coreseek,一款中文全文检索/搜索软 ...

随机推荐

  1. less循环写css工具类

    //margin-right=================.mr(100); .mr(@n, @i: 1) when (@i =< @n) { .mr-@{i} { margin-right ...

  2. 远程主机关闭了连接。错误代码是 0x80070057,与远程主机通信时发生错误。错误代码是 0x80070057

    远程主机关闭了连接.错误代码是 0x80070057,与远程主机通信时发生错误.错误代码是 0x80070057突然在异常错误日志中看到这个错误,虽然在测试中发现不影响流的传输,但是不代表没错误,解决 ...

  3. TextView和EditText中添加图片(ImageSpan)

    编辑框中加图片,以前一直以为很复杂,后来发现android有些类已经很好的实现了这些功能. 代码如下: [java] view plaincopy mSubjectDetailView = (Text ...

  4. 【转】Mysql rownum 实现 及应用

    Mysql rownum 实现 转自:http://blog.csdn.net/saydo/article/details/22725953   SELECT @rownum:=@rownum+1 A ...

  5. WPF文字描边的解决方法(二)——支持文字竖排和字符间距调整

    原文:WPF文字描边的解决方法(二)--支持文字竖排和字符间距调整 自前天格式化文本效果出来后,今天又添加文本竖排和调整字符间距的功能.另外,由于上次仓促,没来得及做有些功能的设计时支持,这次也调整好 ...

  6. python 教程 第二十二章、 其它应用

    第二十二章. 其它应用 1)    Web服务 ##代码 s 000063.SZ ##开盘 o 26.60 ##最高 h 27.05 ##最低 g 26.52 ##最新 l1 26.66 ##涨跌 c ...

  7. 构建自己的PHP框架(Redis)

    完整项目地址:https://github.com/Evai/Aier Redis 简介 'Redis' 是一个高性能的 'key-value' 数据库,其 'value' 支持 'String'.' ...

  8. VUE在开发环境下实现跨域

    1. 跨域设置 VUE项目的 config文件夹下index.js文件中修改 dev: proxyTable中的内容(默认是没有内容的): 添加内容: '/list': { target: 'http ...

  9. jquery属性过滤器

    <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...

  10. 读BeautifulSoup官方文档之html树的打印

    prettify()能返回一个格式良好的html的Unicode字符串 : markup = '<a href="http://example.com/">I link ...