`
xiaomiya
  • 浏览: 131100 次
  • 性别: Icon_minigender_2
  • 来自: 杭州
社区版块
存档分类
最新评论

搭建hexo博客并部署到github上

阅读更多

这几天一直在想用什么来搭建自己的博客。无意中接触到hexo

hexo是由Node.js驱动的一款快速、简单且功能强大的博客框架,支持多线程,数百篇文章只需几秒即可生成。支持markdown编写文章,可以方便的生成静态网页托管在github上。

感觉不错。

前端人员都在用github分享自己的代码。所以想着用hexo部署到git上。搞一个自己的博客。

1,安装hexo

安装hexo前:

        安装Git

        下载 msysgit 并执行即可完成安装。

        安装node.js

       在 Windows 环境下安装 Node.js 非常简单,仅须下载安装文件并执行即可完成安装。

安装hexo:

利用 npm 命令即可安装。(在任意位置点击鼠标右键,选择Git bash

npm install -g hexo

 

创建hexo文件夹:

安装完成后,在你喜爱的文件夹下(如H:\hexo),执行以下指令(在H:\hexo内点击鼠标右键,选择Git bash),Hexo 即会自动在目标文件夹建立网站所需要的所有文件。

hexo init

 

安装依赖包

npm install

 

启动本地服务

现在我们已经搭建起本地的hexo博客了,执行以下命令(在H:\hexo),然后到浏览器输入localhost:4000看看。

hexo generate
hexo server

 

好了,至此,本地博客已经搭建起来了,只是本地哦。别人是看不到了,

下面我们讲博客部署到github上面。

 

注册Github帐号。

已有就跳过。

这里的就不用介绍了。

创建repository

登录github后,将鼠标点击github右上角“+”号,在下拉菜单上,选择“New repository”项,将跳到如下页面,填写库名称,勾选“Initialize this repository with a README”,点击“create repository”,即可完成创建库。

 

 

部署

编辑_config.yml(在H:\hexo下)。你在部署时,要把下面的zippera都换成你的账号名。

deploy:
  type: github
  repository: https://github.com/xiaomiya/xiaomiya.github.com.git
  branch: master

 

执行下列指令即可完成部署。

hexo generate
hexo deploy

 注意:有些新用户需要设置 ssh,否则上述命令会失败。ssh 的介绍和设置方法请看官方教程,不用担心,很简单。

记住:每次修改本地文件后,需要hexo generate才能保存。每次使用命令时,都要在H:\hexo目录下。

Okay,我们的博客已经完全搭建起来了,在浏览器访问zippera.github.io就能看到你的成就了!

还有一点,有一些用户在hexo deploy之后会有个这个提示



 

那么我们要输入我们在git上验证的邮箱



 

如这样。再次hexo deploy

就发布上去了。

就可以看到我们就成就了。。。

bugs

  1. 有网友反应右键菜单中没有git bash选项,可以进入开始菜单找到git bash,然后通过cd进入相应目录执行命令。
  2. 在github部署完成之后,马上访问可能出现404错误,这是正常的,(最多)等待十分钟左右就可以访问了。如果还不行,那很可能是 github 发送给你的验证邮件你没有打开看,据多方反映,验证后就没问题了。
  3. 如果在hexo d之后出现fatal: 'username.github.io' does not appear to be a git repository,一是检查 repo 的名字是否合乎规范、是否含有大写字母、config.yml 中的 deploy 配置是否正确,二是把 git bash 关掉,重新打开再执行命令。
  4. 有的同学可能不是 IT 界的,或者对shell 命令不太了解。在要求输入密码时,你输入之后密码是不显示的,这是为了安全,并非是你没输上。
  5. 出现乱码的,不要使用 windows 中的「记事本」打开并编辑文件,推荐使用 sublime text,很简单。如果已经在「记事本」中编辑过,需要使用 sublime text 转码为「utf8」。
  6. 安装 hexo 时卡在那儿不动,很可能是网络不给力,能全局 break wall 就好了。
  7. 遇到什么其他的问题,不妨删除.deploy 和db.json 再重新生成试一试。

 

tips

hexo现在支持更加简单的命令格式了,比如:

hexo g == hexo generate

hexo d == hexo deploy

hexo s == hexo server

hexo n == hexo new

 

 

  • 大小: 27 KB
  • 大小: 13.6 KB
  • 大小: 8.5 KB
1
1
分享到:
评论

相关推荐

    搭建Hexo博客+部署到Github

    【搭建Hexo博客+部署到Github...搭建Hexo博客并部署到GitHub是一项相对简单的过程,只需按照上述步骤一步步操作,就能拥有自己的个人博客。学会这个技能,不仅可以记录和分享自己的知识与经验,还能锻炼技术实践能力。

    个人博客系统-前后端,基于hexo搭建

    比如,安装`hexo-generator-archive`插件生成归档页面,`hexo-generator-sitemap`生成站点地图,以及`hexo-deployer-git`实现自动部署到GitHub Pages。 运行`hexo generate`命令会生成静态网页,`hexo server`则...

    hexo+github搭建自己的博客

    接下来,我们需要在GitHub上创建一个新的仓库,这个仓库将会用来存放你的博客源码。仓库的名字一般设置为你在GitHub Pages上的用户名.github.io,因为GitHub Pages会默认使用这个名字的仓库来发布你的网站。记得在...

    GitHub hexo搭建个人博客

    ### GitHub + Hexo 搭建个人博客详细指南 ...通过以上步骤,您可以成功地使用 GitHub 和 Hexo 搭建起属于自己的个人博客,并能够实现基本的功能操作,包括文章的发布、分类管理、标签管理以及 RSS 订阅等功能。

    Hexo + github page 实现搭建博客.pdf

    Github Page是GitHub提供的一项服务,允许用户将静态网页部署在GitHub上,从而可以直接通过github.io域名访问这些页面。Hexo配合Github Page可以快速搭建一个美观、性能优越的个人博客系统。 在搭建博客的过程中,...

    Hexo+github 所需工具

    在搭建Hexo博客的过程中,首先需要安装Node.js,因为Hexo依赖于Node.js环境。从压缩包中的“node-v20.11.0-x64.msi”可以看出,这是Node.js的安装文件,版本为20.11.0,适用于64位操作系统。用户需要下载并安装这个...

    hexo +GitHub个人搭建的博客

    - 同时,可以安装和配置部署工具,如`hexo-deployer-git`,便于将生成的静态页面推送到GitHub。 5. **GitHub Pages服务**: - GitHub Pages是GitHub提供的免费静态网页托管服务,分为User Pages和Project Pages两...

    Hexo博客搭建文件(next主题)

    - 再次运行`hexo g`和`hexo d`,新文章就会自动发布到你的博客上。 6. **扩展与优化** - Hexo支持众多插件,你可以根据需求安装,如SEO优化、代码高亮、阅读计数等。使用`npm install --save <plugin-name>`安装...

    Hexo + github page 实现搭建博客.zip

    "Hexo + GitHub Page 实现搭建博客"的主题旨在介绍如何利用Hexo静态站点生成器和GitHub提供的免费托管服务GitHub Page来创建一个自己的在线博客。下面将详细阐述这一过程中的关键步骤和涉及的技术知识点。 首先,...

    Hexo在github上构建免费的Web应用 _ 粉丝日志1

    【Hexo在GitHub上构建免费的Web应用】 Hexo是一个基于Node.js的静态博客框架,设计得简洁且高效。它允许开发者快速搭建个人博客,并且能够方便地部署到GitHub Pages,从而实现一个无需服务器成本的Web应用。Hexo的...

    hexo github page本地仓库代码

    综上所述,"hexo github page本地仓库代码"涉及了使用Hexo创建个人博客,并将其部署到GitHub Pages的过程。通过这个本地仓库,你可以看到整个博客的结构、配置以及所有文章的源文件。通过持续更新和优化,你可以创建...

    hexo搭建博客,真好用

    2. **搭建Hexo博客的前置准备** - **GitHub账户**:用于托管博客的静态文件和作为博客的主要访问地址。 - 创建一个名为`GitHub用户名.github.io`的仓库,用于存放博客的文件。 - **Node.js安装**:Hexo基于Node....

    hexo博客 nodejs +博客搭建+butteflr主题自用

    在本文中,我们将深入探讨如何使用Node.js和Hexo框架搭建个人博客,并专注于Butterfly主题的自定义和应用。Hexo是一个基于Node.js的静态站点生成器,它可以帮助我们快速、高效地创建博客,而Butterfly主题以其美观、...

    用Hexo搭建个人博客共7页.pdf.zip

    6. **部署博客**:说明如何将本地博客部署到GitHub Pages或其他托管服务,如Netlify或Vercel。 7. **插件和扩展**:推荐一些常用的Hexo插件,如SEO优化插件、评论系统插件等,以及如何安装和配置它们。 8. **博客...

    xkcoding.github.io:hexo博客,部署在githubcoding

    【标题】:“xkcoding.github.io:hexo博客,部署在githubcoding”指的是一个使用Hexo框架构建的个人博客,该博客已经成功部署在GitHub Pages上,并且可以通过"xkcoding.github.io"这个域名进行访问。这个项目的源...

    基于Hexo搭建的博客系统源码.zip

    - **写作与发布**: 在`source/_posts`目录下创建Markdown文件写作,然后运行`hexo generate`生成静态页面,`hexo deploy`部署到服务器。 2. **Hexo的核心组件**: - **Markdown解析器**: Hexo使用默认的`hexo-...

    xiyoung.github.io:我的博客网站由Hexo和Next开发,部署在Github Pages中

    【描述】:“借用和搭建的个人博客,这是我部署在Github Pages上的仓库,如果想要部署到本地,” 这段描述说明了博客源代码存储在一个公开的Github仓库中,使得其他人可以访问并学习如何搭建类似博客。Github Pages...

    hexo-theme-next-master_NeXT_hexo-theme-next_hexo_huntk8a_theme-n

    描述中提到“hexo博客搭建,next主题配置,配合github搭建博客,使用hexo d进行github推送更新”,这表明这个压缩包可能包含Hexo的Next主题源码,用于帮助用户快速配置和部署他们的个人博客到GitHub上。下面将详细...

    a1046700338.github.io:使用GitHub-pages通过hexo驱动部署的个人博客网站

    之后,使用`hexo init`初始化一个新的博客项目,接着可以编写Markdown格式的文章,使用`hexo generate`(或简写`hexo g`)生成静态文件,最后通过`hexo deploy`(或`hexo d`)将这些文件部署到GitHub Pages。...

Global site tag (gtag.js) - Google Analytics