使用hexo+GitHub搭建步骤

1. 下载Git和Node.js


1.1 Node.js的安装与配置

(1) 下载安装包

node.js下载网址: https://nodejs.org/en/download

下载完成后,双击安装:点击next,选择安装路径,



(2)添加环境变量

安装完成后,打开cmd验证安装情况:如下图,输入 node -v ,显示版本号则表明安装成功。(注;安装成功的同时也说明了nodejs已经添加到环境变量path中)


(3)接下来,需要设置npm的镜像源

- 查看npm的配置npm config list- 默认源npm config set registry [https://registry.npmjs.org](https://registry.npmjs.org/)- 临时改变镜像源npm --registry=[https://registry.npm.taobao.org](https://registry.npm.taobao.org/)- 永久设置为淘宝镜像源npm config set registry [https://registry.npm.taobao.org](https://registry.npm.taobao.org/)- 设置淘宝镜像源还可以使用另一种方式,编辑 ~/.npmrc 加入下面内容registry = [https://registry.npm.taobao.org](https://registry.npm.taobao.org/)



(4)设置npm的内置路径——>全局模块路径和缓存路径(建议**)**


如果不改变内置路径也可,除非你的C盘空间足够bigger,这一步可以略过,不改变的话,它的路径在:

- npm包全局目录:C:/Users/[username]/AppData/Roaming/npm/node_modules
- npm包全局命令目录:C:/Users/[username]/AppData/Roaming/npm
- npm实际去找全局命令的目录:C:/Users/[username]/.npmrc 文件内容的prefix值
- npm包全局cache目录:C:/Users/[username]/.npmrc 文件内容的cache值

首先在你Node.js的安装位置,新建两个文件夹,node_global和node_cache

然后分别执行的命令就是:

npm config set prefix"C:\Program Files\nodejs\node_global"
npm config set cache "C:\Program Files\nodejs\node_cache"

(5)修改用户变量
然后在配置环境变量,右击我的电脑 ->属性 -> 高级系统设置 -> 环境变量同样的位置,在用户变量的地方,找到path变量进行修改,修改值如下图:
使用

替换

至此,node.js 安装完成。


1.2 Git的安装与配置

下载地址: https://git-scm.com/downloads

  • (1)下载,然后点击安装包进行安装,一切默认即可

  • (2)在cmd中敲 git 和 git --version ,如下图则表明安装成功。


2、Github注册以及Github Pages创建

这里就不多介绍了。


3、配置Git用户名和邮箱

在桌面点击鼠标右键,点击Git Bash Here

然后分别输入下面的两个命令,并回车:


4、本地安装hexo静态博客框架以及发布到Github Pages

首先选择一个磁盘作为你博客文件的存放位置,然后新建一个文件夹,比如名为blogtest的文件夹,创建完后,先不要点进去,在此处点击鼠标右键,选择Git Bash Here,然后依次输入如下命令:

注意,这里不知道是不是安装node.js时使用的是自定义路径,在执行了 npm install -g hexo-cli 后,也无法使用 hexo 命令,一直报错。

经查询(参考https://blog.csdn.net/qq_42893625/article/details/100852221):使用如下命令后安装成功:

最后解释一下,为啥要在前面加上npx。

在大牛阮一峰的网络日志中,他是这么描述的:“npx 想要解决的主要问题,就是调用项目内部安装的模块”,所以可以理解为在命令行下调用,可以让项目内部安装的模块用起来更方便,npx运行的时候,会到node_modules/.bin路径和环境变量$PATH里面,检查命令是否存在,所以系统命令也可以调用,即上面的命令安装不成功的时候加上npx的话也许就可以成功了哦~

浏览器中打开http://locakhost:4000或者127.0.0.1:4000,可以看到一个网页,说明Hexo博客已经成功在本地运行


5、 本地博客发布到Github Pages

5.1

首先需要安装发布的插件,在站点目录下执行下面的命令,也就是创建的博客目录下:

npm install hexo-deployer-git --save

5.2

紧接着,将本地目录与GitHub关联起来,输入下面的命令行:

ssh-keygen -t rsa -C "邮箱地址"

输入后一直回车,

然后在C:/Users/[username]目录下找到名为.ssh的文件夹, 文件夹内会有两个文件,一个id_rsa.pub一个id_rsa,用文本编辑器打开id_rsa.pub,复制里面的的内容。 然后打开Github,点击右上角的头像 Settings 选择SSH and GPG keys,添加ssh key 。

然后回到Git的命令行界面,测试一下是否与GitHub连接成功。输入下面的命令行:

ssh -T [git@github.com](mailto:git@github.com)

点击回车,然后会出现一个询问内容,输入yes,回车,会出现一段内容,

Hi ! You’ve successfully authenticated, but GitHub doesnot provide shell access.。

说明连接成功。此处这个应该是你Github的用户名。

5.3

进入博客站点目录,用文本编辑器打开_config.yml,这个_config.yml是博客的配置文件,在以后的博客修改,如个性化修改,博客SEO优化等都会使用到,修改如下图的几个地方:

滑到文件最底部,有一个deploy,在deploy下面添加一个repo项 ,一个branch项。填入如下代码,并如下图所示:

5.4

生成页面,并发布至Github Pages,执行如下命令:

上传完成后,在浏览器中打开https://<用户名>.github.io,查看上传的网页。如果页面变成了之前本地调试时的样子,说明上传以及完成了。没变的话查看一下上传时命令行窗口的信息有没有错误信息,没有的话清除一下浏览器缓存试试。

注:这几天一直使用的npx hexo 来当命令,直接使用报错,网上说是因为没用添加hexo 下的 node_modules.bin 文件
到环境变量中,但是我是加了这个到系统变量path中的,没起作用。
今天我又去这个文件夹下面找了一下,果然,里面有个命名为hexo文件,嗯,那应该就是添加这个了文件夹了。
于是了,我复制了目录,替换了原先的那个,保存后发现居然行了,额,真无语。

参考链接:https://blog.csdn.net/victoryxa/java/article/details/103733655

使用hexo+GitHub搭建步骤相关推荐

  1. Hexo+github搭建个人博客-博客发布篇

    通过 Hexo+github搭建个人博客-环境搭建篇 以及 Hexo+github搭建个人博客-博客初始化篇 ,我们了解到了利用Hexo搭建个人博客需要的环境以及配置,下面这篇文章将会介绍如何把我们的 ...

  2. Hexo+github搭建个人博客-博客初始化篇

    文章推荐 精选java等全套学习资源 精选java电子图书资源 精选大数据学习资源 java项目练习精选 上一篇博文 [<Hexo+github搭建个人博客-环境搭建篇>](http:// ...

  3. vsphere通用配置_Mac环境下如何用Hexo+Github搭建个人博客

    一个爱折腾的人,总是忍不住去自己动手尝试新鲜事物.就拿写博客来说,虽然网上已经提供了很多博客平台,但是总有一些个性化的需要得不到满足.所以就抽空去网上找了下如何使用Hexo+Github 搭建自己博客 ...

  4. hexo部署成功但是没效果_使用 Hexo+GitHub 搭建个人免费博客教程(小白向)

    前言 近些年来很多用户都喜欢使用 GitHub Pages 来搭建 Hexo 静态博客网站,其最吸引人的莫过于完全免费使用,并且非常稳定. 虽然搭建时比较麻烦,有点折腾,但是配置完成后,基本不需要操心 ...

  5. 利用 Hexo + Github 搭建自己的博客

    扯在前面 在很久很久以前,一直就想搭建属于自己的一个博客,但由于各种原因,最终都不了了之,恰好最近突然有了兴趣,于是就自己参照网上的教程,搭建了属于自己的博客. 至于为什么要搭建自己的博客了?哈哈,大 ...

  6. win10+hexo+github搭建个人博客

    win10+hexo+github搭建个人博客 参考:https://hexo.io/,博客用于记录自己的学习工作历程 参考以下步骤安装 1.搭建环境准备(包括node.js和git环境,gitHub ...

  7. 【小白】【新手向】Hexo+Github搭建个人博客

    如题,一个[小白][新手向]的,关于Hexo+Github搭建个人博客. 针对于: 对于代码完全不懂的纯小白! 完全不知道什么是hexo,git和github的小白! 感觉像是在打广告,其实并不是.事 ...

  8. 猿创征文|Hexo+Github搭建完全免费个人博客详细教程

    前言 完全免费的搭建个人博客,没有任何收费,零基础也能上手,不需要编程基础,跟着操作来即可. 首先: 要了解一下我们搭建博客要用到的框架:Hexo是高效的静态站点生成框架,它基于Node.js.通过H ...

  9. Hexo+Github搭建个人博客和个人主页

    Hexo+Github搭建个人博客和个人主页 在自己的个人主页搭建起来之前,看到网上其他人酷炫的个人主页,而且有自己专属的域名,羡慕的不行.现在自己的个人主页也做出来了,在这里做一个总结,给也想做个人 ...

最新文章

  1. Android 正则表达式实例
  2. 讨论是学习最有效的方法
  3. app.vue中引用图片src=“../assets/logo.png“报错未找到图片
  4. java 跨平台 ios_OGEngine发布跨平台版本,支持iOS及Android
  5. 【转】软件开发常用术语
  6. 如何搭建apache+tomcat集群
  7. 如何在WP7中实时监控内存使用量
  8. 每天学点Python Cookbook(三)
  9. springboot整合mybatis-pluss、sharding-JDBC 水平分表demo
  10. 尚硅谷html+css小米官网
  11. 微信小程序地图polygons自己标点,三个点以上连成面
  12. win10计算机无法复制文件,Windows10系统无法复制文件到u盘的解决方案
  13. Failed to start LSB: Bring up/down错误解决方法
  14. Vue+JTopo(一)
  15. 水果店微信小程序定制开发需要多少钱【最新报价方案】
  16. HTML页面查看world等文件,网页文件 - HTML - 网页基础 - KK的小故事
  17. Padavan老毛子的二级路由,怎样设置与主路由在同一网段
  18. 频率超出范围黑屏Linux,Win10专业版分辨率超出工作频率范围黑屏怎么办
  19. 函数模板的特例化(专用化)以及类型含有const的特殊情况
  20. js创建一个电脑对象,该对象要有颜色、重量、品牌、型号,可以看电影、听音乐、打游戏和敲代码。

热门文章

  1. 洛谷2149 Elaxia的路线(dp+最短路)
  2. 函数和常用模块【day04】:内置函数(十)
  3. EZ_USB salveFIFO
  4. Mongodb总结1-启动和Shell脚本
  5. WPF 界面提示加载出错
  6. 解决Maven的jar包冲突问题
  7. 【报告分享】人工智能新时代报告.pdf(附下载链接)
  8. 通俗易懂!视觉slam第十部分——贝叶斯估计
  9. 深度学习福利入门到精通第五讲——ResNet模型
  10. 【特色团队采访】1+1+1>3?看新人团队如何高效合作