好好学习天天向上实用小技能

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

2017-07-31  本文已影响67人  流云012

参考网站

Hexo & Jekyll 的对比

Hexo 搭建过程及问题解决

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

  2. 通过 npm 安装 Hexo

    $ sudo npm install -g hexo-cli
    

    <p style="color: red;font-size: 12px;">注意:出现错误: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。后重新安装即可</p>

  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
    

    <p style="color: red;font-size: 12px;">注意:初次安装要使用 sudo,管理员授权,否则会出现错误提示:ERROR: While executing gem ... (Gem::FilePermissionError)
    You don't have write permissions for the /Library/Ruby/Gems/2.0.0 directory. </p>

  2. 通过 ruby 的 gem 安装 jekyll

     $ sudo gem install bundler
     $ gem install jekyll
    

    <p style="color: red;font-size: 12px;">注意:安装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/!</p>

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

     $ jekyll new myblog 
     $ cd myblog
     $ jekyll serve
    

    <p style="color: red;font-size: 12px;">注意:报错:Deprecation: The 'gems' configuration option has been renamed to 'plugins'. Please update your config file accordingly. 解决办法:打开配置文件_config.yml,使用 plugins 替换 gems 即可。</p>

  4. 在浏览器中输入:http://localhost:4000,即可打开博客预览
    <p style="color: red;font-size: 12px;">注意:若电脑端的 4000端口被占用,会报错:Error: Permission denied - bind(2) for 127.0.0.1:4000,解决方法:在_config.yml文件的末尾加上port: 5000,改为5000端口即可。在浏览器输入:http://127.0.0.1:5000/ 访问即可</p>

  5. 主题的选择与安装

上一篇下一篇

猜你喜欢

热点阅读