如何在coding上用HEXO搭建个人博客

一.准备工具

1.Git

• Windows：下载并安装 git.
• Mac：使用 Homebrew, MacPorts ：brew install git;或下载 安装程序 安装。
• Linux (Ubuntu, Debian)：sudo apt-get install git-core
• Linux (Fedora, Red Hat, CentOS)：sudo yum install git-core

  • Mac 用户

    您在编译时可能会遇到问题，请先到 App Store 安装 Xcode，Xcode 完成后，启动并进入 Preferences -> Download -> Command Line Tools -> Install 安装命令行工具。

  • Windows 用户

    由于众所周知的原因，从上面的链接下载git for windows最好挂上一个代理，否则下载速度十分缓慢。也可以参考这个页面，收录了存储于百度云的下载地址。

2.Node.js

安装 Node.js 的最佳方式是使用 nvm。

• cURL:

  $ curl https://raw.github.com/creationix/nvm/master/install.sh | sh

• Wget:

  $ wget -qO- https://raw.github.com/creationix/nvm/master/install.sh | sh

• 安装完成后，重启终端并执行下列命令即可安装 Node.js。

$ nvm install stable
           

• 或者您也可以下载安装程序 来安装

  • Windows 用户

    对于windows用户来说，建议使用安装程序进行安装。安装时，请勾选Add to PATH选项。

    另外，您也可以使用Git Bash，这是git for windows自带的一组程序，提供了Linux风格的shell，在该环境下，您可以直接用上面提到的命令来安装Node.js。打开它的方法很简单，在任意位置单击右键，选择“Git Bash Here”即可。由于Hexo的很多操作都涉及到命令行，您可以考虑始终使用 Git Bash来进行操作。

3.Coding

Coding可以说，就是国产的Github，但是，有一个功能使它似乎超越了GitHub，那就是 Web IDE。

Coding WebIDE 是 Coding 自主研发的在线集成开发环境 (IDE)。用户可以通过 WebIDE 创建项目的工作空间, 进行在线开发, 调试等操作。同时 WebIDE 集成了 Git 代码版本控制, 用户可以选择 Coding、GitHub、BitBucket、Gi[email protected] 等任意的代码仓库。 WebIDE 还提供了分享开发环境的功能, 用户可以保存当前的开发环境, 分享给团队的其他成员。

摘抄自 Coding WebIDE官网

二.步骤

1. 创建项目

   你需要在 Coding 上面新建一个项目，项目名称一定要是* 用户名.coding.me*,因为hexo只能弄在根目录上，这样它内置的文件引用目录才能都正确。

   填写项目名称、描述、设置属性、初始化文件，最后点击“创建项目”

   

2. 接着，我们传送到Coding WebIDE，单击“+ 新建工作空间”。

   

3. 随后，单击“同步仓库”，等待同步仓库完成。

   

   • webIDE是部分收费的，但是不用着急，官方提供了一些方式免费获得其网站虚拟币——码币，且Coding在注册后会送给用户一些码币，足以让IDE跑起来啦

     

4. 言归正传，我们创建IDE。配置不变，直接鼠标拉到最底下，单击“创建”，这时候，空间创建完毕，点开创建完成的工作空间。

   

5. Hexo是基于Nodejs的，所以我们将右侧“运行环境”切换为Nodejs。

   

   单击“使用”后，再单击确定。下面，我们单击左下方“终端”来打开终端
6. 进入正式安装步骤，首先，我们在终端中输入

   sudo npm install -g hexo-cli

   安装进程，就会全自动完成。安装结果如下图，安装就成功了

   

7. 接着，我们创建一个文件夹用于存放文章与设置。

   mkdir hexo

8. 然后，使用init命令初始化博客。

   cd hexo

   sudo hexo init

9. 初始化进程需要安装一些辅助插件，所以比安装的时候慢，需要耐心等待…等待初始化进程完成后，安装进程就正式完成啦~
10. 我们首先先解锁一下配置文件（将所有文件提权至777）

    sudo chmod -R 777 *

11. 接着，我们可以暂时关闭终端，编辑一下博客的设置,依次打开文件树中的目录：项目名->hexo->_config.yml 这时，我们就可以在编辑窗口中编辑属性：

    title为标题，subtitle小标题【可不填】，author作者，language语言【可不填】，timezone时区【可不填】。

    我做了如下修改:

    # Site title: SUMMER subtitle: summer`s blog description: welcome to my blog author: summer language: timezone:

    修改完成之后别忘了保存。CTRL+S保存
12. 接着我们可以使用以下命令来开启本地服务器：

    hexo server

13. 然后，我们就可以通过单击右上角的访问链接，将端口设置为4000来访问网站。

    

14. 测试成功了，那么我们先在终端中按Ctrl+C退出，然后按下访问链接中的垃圾桶来销毁端口。那么大家刚才也看到了，IDE中的访问链接是测试用途，而且有时间限制，一看就非常不严谨，所以，我们要学会把博客Push到托管平台中。那么首先，我们要安装Hexo Git插件才可以将静态页推送到托管平台上。

    sudo npm install hexo-deployer-git --save

15. 安装完成之后，我们配置一下_config.yml文件。修改一下最下面的deploy：

    deploy:
    type: git  
    repo: [仓库地址]
    branch: master
    message: blog update
               

    注：仓库地址可以在您的项目主页找到。

    

    我填入了repo：

    deploy:
    
    #我们是使用 git 来部署的。
    
    type: git
    
    # git仓库的地址。
    
    repo: https://summerwait:[email protected].coding.net/summerwait/summerwait.coding.me.git
    
    # 分支名称。
    
    branch: master
    message: blog update
               

16. 随后，我们就可以将博客推送到代码托管平台了，在终端中使用这个命令：

    sudo hexo deploy

    和往常的推送操作一样，终端会要求用户输入用户名与密码。

    

    推送成功

17. 下面，我们开启静态页服务（Pages）。

    只需要单击页面上的“Pages服务”，设置部署来源为master分支，然后单击“保存”，就可以访问啦！ 现在去访问试试吧。这里是我的地址，欢迎来访~

参考资料：

1.Hexo文档

2.使用Coding.net来搭建基于Hexo的免费博客（一）