个人博客网站的详细搭建过程( Jekyll 和 Hexo)

参考网站

  • Github 绑定个人域名

    • 域名+解析+GitHub来搭建自己的个人网站
  • Hexo 搭建参考(个人推荐使用)

    • hexo中文官网
    • 静态博客框架之Hexo & Jekyll
    • HEXO+Github,搭建属于自己的博客
    • Hexo主题资源汇总
    • Hexo集成Algolia搜索插件
  • Jekyll 搭建参考

    • 搭建一个免费的,无限流量的Blog----github Pages和Jekyll入门 -- 阮一峰
    • Jekyll中文官网
    • 安装 Ruby gem
    • Jekyll官网安装文档
    • Mac下Jekyll安装
    • Jekyll搭建写作环境问题集锦
    • Jekyll主题资源汇总

Hexo & Jekyll 的对比

  • Jeky基于Ruby实现,安装Jeky需要搭建Ruby环境,在Windows搭建Ruby环境并不是被推荐的,而 Hexo基于NodeJs实现,在Windows上安装NodeJs开发环境简单。
  • 两者都有很多各自的主题提供,可依据个人喜好去选择
  • 两者都支持Markdown语法

Hexo 搭建过程及问题解决

  1. 确保电脑已经安装 Node.js 和 Git,若没有安装,请自行搜索安装教程 。

  2. 通过 npm 安装 Hexo

    $ sudo npm install -g hexo-cli
    

    注意:出现错误:npm ERR! path /usr/local/bin/hexo
    npm ERR! code EEXIST
    npm ERR! Refusing to delete /usr/local/bin/hexo: ../lib/node_modules/hexo/bin/hexo symlink target is not controlled by npm /usr/local/bin;解决办法:执行命令:rm /usr/local/bin/hexo。后重新安装即可

  3. 创建一个文件夹,如:Blog,cd到Blog里执行hexo init的。命令:

    $ hexo init blog
    $ cd blog
    
  4. 继续再Blog目录下执行如下命令,生成静态页面

    $ hexo generate (hexo g  也可以)   
    
  5. 启动本地服务,进行文章预览调试,浏览器输入http://localhost:4000 打开预览:

    $ hexo server   
    

Jekyll 搭建过程及问题解决

  1. 通过 Homebrew 包管理器 安装 Ruby

     $ sudo brew install ruby
    

    注意:初次安装要使用 sudo,管理员授权,否则会出现错误提示:ERROR: While executing gem ... (Gem::FilePermissionError)
    You don't have write permissions for the /Library/Ruby/Gems/2.0.0 directory.

  2. 通过 ruby 的 gem 安装 jekyll

     $ sudo gem install bundler
     $ gem install jekyll
    

    注意:安装jekyll之前需要先安装 bundler,否则会报错: Dependency Error: Yikes! It looks like you don't have bundler or one of its dependencies installed. In order to use Jekyll as currently configured, you'll need to install this gem. The full error message from Ruby is: 'cannot load such file -- bundler' If you run into trouble, you can find helpful resources at https://jekyllrb.com/help/!

  3. 新建一个初始的Jekyll项目,并启动本地预览服务

     $ jekyll new myblog 
     $ cd myblog
     $ jekyll serve
    

    注意:报错:Deprecation: The 'gems' configuration option has been renamed to 'plugins'. Please update your config file accordingly. 解决办法:打开配置文件_config.yml,使用 plugins 替换 gems 即可。

  4. 在浏览器中输入:http://localhost:4000,即可打开博客预览

    注意:若电脑端的 4000端口被占用,会报错:Error: Permission denied - bind(2) for 127.0.0.1:4000,解决方法:在_config.yml文件的末尾加上port: 5000,改为5000端口即可。在浏览器输入:http://127.0.0.1:5000/ 访问即可

  5. 主题的选择与安装

你可能感兴趣的:(个人博客网站的详细搭建过程( Jekyll 和 Hexo))