美文网首页程序界程序之路
Hexo + gitHubPage +git博客搭建

Hexo + gitHubPage +git博客搭建

作者: Ludwigvan | 来源:发表于2018-12-14 13:42 被阅读92次

    Hexo + gitHubPage +git博客搭建

    之前参照网上的教程完成了博客的搭建。记录下自己怎么搭建博客的。

    大致流程如下:
    1. 环境搭建(包括Node Git)
    2. Github账号注册和配置
    3. 安装配置Xexo
    4. 关联Hexo 和 Github Pages
    5. Hexo 的常用操作
    6. 结束语

    环境搭建

    为什么要搭建环境?--因为Hexo 是一个基于Node的静态博客系统
    Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境,可以在非浏览器环境下,解释运行 JS 代码。

    在 Node.js 官网:https://nodejs.org/en/ 下载安装包 v6.10.3 LTS

    保持默认设置即可,一路Next,安装很快就完成了。

    然后打开命令提示符,输入 node -v、npm -v,出现版本号则说明 Node.js 环境配置成功!!!

    然后配置Git环境:

    为什么要配置Git 环境? 因为可以通过Git命令上传内容到GitHub上,类似大家常用的SVN.

    Git 是一款免费、开源的分布式版本控制系统,用于敏捷高效地处理任何或小或大的项目。

    在 Git 官网:https://git-scm.com/ 下载安装包 Git-2.13.0-64-bit.exe.

    image

    然后一直默认点next即可.
    在电脑的任何地方鼠标右键有个Git Bash 的东西点击一下弹出一个控制台输入 git --version,出现git 的相关版本信息环境就搭建好了。

    Github账号注册和配置

    GitHub 是一个代码托管平台,因为只支持 Git 作为唯一的版本库格式进行托管,故名 GitHub。

    Github注册:https://github.com/

    image

    然后注册什么的就自己搞搞很简单。
    下面说明怎么配置github 里的GitHubPages:
    首先创建一个仓库:


    image

    点击如图所示:然后会让你填Repository Name:
    请注意:这里的name的格式是:你的注册账户名.github.io 比如我这里的是EzHomeSixGod.github.io,创建成功后默认是Master分支:你也可以新开一个pages分支:

    image

    点击1 可以新建分支,我这里没有新建直接在master 上面的。然后点击2 Setting配置Github Pages.

    image

    这里这个Source会自动选择如果你是分支会是分支名。然后点击下面的Choose Theme 即可选择自己的主题。成功的话会有一个 https://你的账户名.github.io/ 就可以直接点击访问了。

    Hexo安装

    Node, npm和Git都安装成功, 开始安装hexo

    npm install hexo -g #-g表示全局安装, npm默认为当前项目路径安装

    等待一会安装完成后输入

    hexo --v:

    如果打印出hexo的版本信息那么恭喜你安装成功。

    安装 Hexo 完成后,请执行下列命令来初始化 Hexo,用户名改成你的,Hexo 将会在指定文件夹中新建所需要的文件。

    hexo init EzHomeSixGod.github.io

    cd EzHomeSixGod.github.io

    npm install
    新建完成后,指定文件夹的目录如下:

    安装 Hexo 完成后,请执行下列命令来初始化 Hexo,用户名改成你的,Hexo 将会在指定文件夹中新建所需要的文件。

    hexo init EzHomeSixGod.github.io

    cd EzHomeSixGod.github.io

    npm install
    新建完成后,指定文件夹的目录如下:

    .

    • ├── .deploy #需要部署的文件
    • ├── node_modules #Hexo插件
    • ├── public #生成的静态网页文件
    • ├── scaffolds #模板
    • ├── source #博客正文和其他源文件,404、favicon、CNAME 都应该放在这里
    • | ├── _drafts #草稿
    • | └── _posts #文章
    • ├── themes #主题
    • ├── _config.yml #全局配置文件
    • └── package.json #npm 依赖等

    下面运行下本地Hexo:

    hexo server
    或者
    hexo s

    您的网站会在 http://localhost:4000 下启动。如果 http://localhost:4000 能够正常访问,则说明 Hexo 本地博客已经搭建起来了,只是本地哦,别人看不到的。下面,我们要部署到Github。

    image

    注意:执行hexo server提示找不到该指令

    解决办法:在Hexo 3.0 后server被单独出来了,需要安装server,安装的命令如下:

    sudo npm install hexo-server
    或者
    npm install hexo -server --save

    关联Hexo 和Github pages

    我们如何让本地git项目与远程的github建立联系呢?用 SSH keys

    生成SSH keys

    输入你自己的邮箱地址

    ssh-keygen -t rsa -C "*********@qq.com"

    在回车中会提示你输入一个密码,这个密码会在你提交项目时使用,如果为空的话提交项目时则不用输入,我们按回车不设置密码。

    添加 SSH Key 到 GitHub

    打开 C:\Users\.ssh\id_rsa.pub,此文件里面内容为刚才生成的密钥,文件名可能不一样,大家可以看控制台输出的内容,然后准确的复制这个文件的内容,粘贴到 https://github.com/settings/ssh 的 new SSH key 中

    测试

    可以输入下面的命令,看看设置是否成功,git@github.com的部分不要修改:

    ssh -T git@github.com

    如果提示:

    Hi aierui! You've successfully authenticated, but GitHub does not provide shell access.

    说明配置成功。

    配置Git个人信息

    现在你已经可以通过 SSH 链接到 GitHub 了,还有一些个人信息需要完善的。
    Git 会根据用户的名字和邮箱来记录提交。GitHub 也是用这些信息来做权限的处理,输入下面的代码进行个人信息的设置,把名称和邮箱替换成你自己的。

    git config --global user.name "yourname"
    git config --global user.email "yourqq@qq.com"
    配置 Deployment

    在_config.yml文件中,找到Deployment,然后按照如下修改,用户名改成你的:

    需要注意的是:冒号后面记得空一格!

    Deployment
    Docs: https://hexo.io/docs/deployment.html
    deploy:
    type: git
    repo: git@github.com:yourgithubname/youtgithubname.github.io.git
    branch: master

    本地文件提交到 GitHub Pages

    删除旧的 public 文件

    hexo clean

    生成新的 public 文件

    hexo generate
    或者
    hexo g

    开始部署
    hexo deploye
    或者
    hexo d

    在浏览器中输入 https://yourgithubname.github.io (用户名改成你的)看到了 Hexo 与 GitHub Pages 已经成功关联了

    注意:若上面操作失败,则需要提前安装一个扩展:

    npm install hexo-deployer-git --save
    注意2:如果在执行 hexo d 后,出现 error deployer not found:github 的错误(如下),则是因为没有设置好 public key 所致,重新详细设置即可。

    Permission denied (publickey).
    fatal: Could not read from remote repository.
    Please make sure you have the correct access rights
    and the repository exists.

    在执行hexo deploy前把在本地写好的README.md文件复制到.deploy文件夹中,再去执行hexo deploy。

    Hexo 常用操作

    这个大家可以参考官方文档还是很详细的。https://hexo.io/

    发表一篇文章

    hexo new "文章标题"
    在本地博客文件夹 source_posts 文件夹下看到我们新建的 markdown 文件。

    当然,我们也可以手动添加Markdown文件在source->_deploy文件夹下,其效果同样可以媲美hexo new

    文章编辑好之后,运行生成、部署命令:

    hexo clean

    hexo g

    hexo d
    当然你也可以执行下面的命令,相当于上面两条命令的效果

    hexo clean

    hexo d -g

    结束语

    其他的配置大家可以参考官方文档,包括主题,样式,标签,还有很多其他的特效。

    相关文章

      网友评论

        本文标题:Hexo + gitHubPage +git博客搭建

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