美文网首页
用 GitHub Pages 建立 Hexo 博客 详细图文教程

用 GitHub Pages 建立 Hexo 博客 详细图文教程

作者: 3e8470db5f96 | 来源:发表于2017-03-04 19:41 被阅读56次

    请根据您的作业系统下载以下两个本次教程需要使用到的工具。

    教程向≠科普向

    本篇教程使用Windows作业系统作为示范。

     本篇环境配置

       ×安装Git

       ×安装Node.js

    什么是GitHub

    简单说,Git就是一个大型共享的代码仓库,也称之为程序员的Facebook

    至于Github pages 最早是程序员们用于演示他们的项目效果,总之就是用户托管在github上的静态网页。

    那么Node.js是什么呢?

    这边分享一个网站的介绍。

    为什么这么做?

    因为免费、无流量限制

    就这么简单粗暴。

    关于修改主题、更换域名...等后续工作本篇不讲,自行百度爬文!


    工具/材料下载

    1. git

    用于把本地的HEXO内容提交到github上去

    Download:https://git-scm.com/downloads

    ****git for windows*(Windows系统请戳下方链结) --->

    https://git-for-windows.github.io/

    2. Node.js

    用来生成静态页面的

    Download:http://nodejs.cn/download/

    无法下载请至 http://www.pc6.com/softview/SoftView_209026.html


    申请GitHub

    先至https://github.com/申请账号。

    若页面出现以下信息,请至EMAIL验证账号。

    启用验证信里的链结后,登陆账号,选择Start a project

    1.  新建代码库

    在Repository name下填写yourname.github.io

    yourname = 你的账户名 (忘记的请自行拉到最上,图一申请Github时所输的用户名)

    一个github用户只能创建一个个人静态网页和一个组织静态网页,所以请谨慎填写,万一填错了删除project重新创就行。

    【这一步非常重要,如果账户名和Repository name不一样会出错】

    2. 代码库设置

    点击界面右侧的Settings,向下拖动直到看见GitHub Pages

    选择master branch 点击Save

    安装HEXO

    1. 利用Git npm 命令 安装HEXO

    在任意位置点击鼠标右键,选择Git Bash Here。

    输入 下方指令后按下回车键 (安装需要一些时间)

    npm install hexo-cli -g 

    -g = 全局安装HEXO

    2. 在随便一个喜爱的位置,新建"HEXO"资料夹

    并在资料夹内 点击"鼠标右键",选择"Git Bash Here"

    输入 下方指令后按下回车键 (安装需要一些时间)

    hexo init 

    再输入

    npm install

    3. 刚刚的init指令完成后,继续输入

    hexo generate

    hexo server 

    启动本地服务,进行文章预览调试,

    出现以下文字后,可以开启浏览器,输入 http://localhost:4000/

    本地预览


    修改配置文件

    4. 回到HEXO资料夹里,在资料夹内点击鼠标右键,选择Git Bash,

    输入 

    vim _config.yml 

    翻到底部 deploy:

    改为

    deploy:

    type: git

    repository: https://github.com/你的 github 账户名/你的 github 账户名.github.io.git

    branch: master

    (注意 : 后面一定要记得要输 空格 )

    *(或者直接 在 _config.yml 上点击右键 使用notepad++编辑)

    如果之后所有配置完成却打不开网站,可以将repository改成 ssh://git@github.com:your name/your name.github.io.git


    设置SSH keys

    5. 在Git Bash输入以下命令(任意位置点击鼠标右键),检查是否已经存在了SSH keys。

    ls -al ~/.ssh

    如果不存在就没有关系,如果存在的话,直接删除.ssh文件夹*(C:\Users\Administrator\.ssh)里面所有文件:

    输入以下命令(邮箱就是你注册Github时候的邮箱)后,回车:

    ssh-keygen -t rsa -C "email@gmail.com"

    出现 Enter file in .....时按一次回车

    然后出现Enter passphrase ... 在: 后面切换成英文输入法 输入你的github密码

    然后再输入一次

    成功就会出现下图

    6. 输入 

    ssh-agent -s 

     回车

    继续输入 

    ssh-add ~/.ssh/id_rsa 

     回车

    (这里我是出错了,不晓得你会不会)

    如果出错了,再输入

     eval `ssh-agent -s` 

    以及 

    ssh-add 

    输入ssh-add命令后 它会要求你再一次输入github密码 请再输入一次

    到了这一步,就可以添加SSH key到你的Github账户了。键入以下指令:

    clip < ~/.ssh/id_rsa.pub

    7. 回到 Github 点击右上角倒三角形 选择Settings

    点击左边 SSH and GPG keys,然后点击右边 New SSH key

    Tittle随意输入,然后到 C:\Users\Administrator\.ssh (每台电脑不一样,Administrator是你的电脑用户名)

    右键文本打开 id_rsa.pub 档案  复制里头全部内容 贴上至Key栏

    出现如图表示配置成功

    最后,随意右键 选择Git Bash 输入 

    ssh -T git@github.com

    你可能会看到有警告,没事,输入“yes”就好。

    常见错误请参考:

    GitHub Help - Generating SSH Keys

    GitHub Help - Error Permission denied (publickey)



    设置用户信息

    8.虽然以上步骤已经将SSH链接到GitHub了,但是Git会根据用户的名字和邮箱来记录提交,因此要设置您的个人信息

    git config --global user.name "cnfeat"//用户名

    git config --global user.email  "cnfeat@gmail.com"//填写自己的邮箱


    完成部署

    9. 一切都准备就绪后,点击右键 选择Git Bash,输入

    hexo generate 

    完成后 继续输入 

    hexo deploy 

    执行配置命令

    然后再浏览器中输入http://你的 github 账户名.github.io/就行了

    每次部署的步骤,可按以下三步来进行。

    hexo clean

    hexo generate

    hexo deploy

    常用命令:

    hexo new "postName" #新建文章

    hexo new page "pageName" #新建页面

    hexo generate #生成静态页面至public目录

    hexo server #开启预览访问端口(默认端口4000,'ctrl + c'关闭server)

    hexo deploy #将.deploy目录部署到GitHub

    hexo help  #查看帮助

    hexo version  #查看Hexo的版本

    其它更深入的就请上百度爬文吧,这篇基本上就是基础建立教程。

    相关文章

      网友评论

          本文标题:用 GitHub Pages 建立 Hexo 博客 详细图文教程

          本文链接:https://www.haomeiwen.com/subject/jiejgttx.html