Nuisance-Hexo

Hexo: Probably the most detailed guide for 2020

Introducing Hexo and this blog

Hexo is a useful tool for people who want to create their own blog website. It is really a convenient tool for it will automatically generate the beautiful designed website and even help you upload it to your Github. The perfect thing about blog is that it can save the people later who do the same thing energy and time. Same reason as I started my blog with this article. It took me 3 hours to use this tool for the bugs and the obsolete blogs elsewhere. Now on 9 February 2020, here we go.

Environment

Here is the things I believe you guys already have and grasped:

  • Git tools
  • Github account
  • Xcode command line tools
  • nvm and Node.js
    If you don’t have it, please see the link below to get those staffs!

Get Hexo work on your MAC!

Go to Terminal, and input those code:

  • Download Hexo
    1
    npm install -g hexo-cli
  • Its extension (Add sudo in the front if not working)
    1
    npm install hexo-deployer-git --save
    Use this if error exists when you download the extension (Take me half hour to get those things down)
    1
    2
    3
    4
    5
    6
    7
    8
    sudo npm install hexo-cli -g  
    npm install hexo-deployer-git --save
    mkdir ~/.npm-global
    npm config set prefix '~/.npm-global'
    export PATH=~/.npm-global/bin:$PATH
    source ~/.profile
    npm install -g jshint
    NPM_CONFIG_PREFIX=~/.npm-global
    Big ones from stackoverflow said that it was global download?(Whatever)

Use hexo to create your Blog project!

  • Now use command cd to get to an empty folder(Must be empty, if error exist just create a new one)
    1
    cd ......//whatever your folder is
  • Initialize your folder, get the basic model for your blog
    1
    hexo init
  • Generate your website(test)
    1
    2
    3
    hexo g
    or
    hexo generate
  • View your website in your browser
    1
    2
    3
    hexo s
    or
    hexo server
    Default location: http://localhost:4000/

Get your Blog available online!

Get SSH key on your Github

See it you got your SSH key on your computer

1
$ cd ~/. ssh

If there is no respond just skip action 2 to action 3

Get your SSH key

1
2
3
$ssh-keygen -t rsa -C "your_email@example.com"
Generating public/private rsa key pair.
Enter file in which to save the key (/c/Users/you/.ssh/id_rsa): [Press enter]

And press return until you see this

1
2
3
4
Your identification has been saved in /c/Users/you/.ssh/id_rsa.
Your public key has been saved in /c/Users/you/.ssh/id_rsa.pub.
The key fingerprint is:
01:0f:f4:3b:ca:85:d6:17:a1:7d:f0:68:9d:f0:a2:db your_email@example.com

Go to the folder where has your ssh key(Here is the route looks like)

1
/c/Users/you/.ssh/id_rsa.

Then go to settings, Express
Then add your new SSH key
Then you need to do some change on this file_config.yml

1
2
3
4
deploy:
type: git
repo: https://github.com/wavky/wavky.github.io.git(Your Github repository,like above)
branch: master

Be careful with the space under the deploy!(My half hour went away!)
@(Error: My Hexo deploy failed)
Error reporting will be like this:

1
2
You should configure deployment settings in _config.yml first!
Available deployer plugins: git

Then finally
Post your Blog in website:

1
hexo g -d

Have trouble finding your blog?

->Settings->GitHub Pages

Thanks for your patience to read this article…..
Just joking
You might also met the problem likeHexo no styles
here is the way to solve it
Go to your ./public/index.html (In your folder)
Found(use command+f)

1
<link rel="stylesheet" href="css/style.css">

Exchange with

1
<link rel="stylesheet" href="(Here is your website name)/css/style.css">

Such as my website named https://mavericktang.github.io/Blogs/
Then the place should be Blogs

Conclusion

Hopefully this article would help you with to solve your problem.
And feel free to visit my personal web!
https://mavericktang.github.io/mavericreate/

Welcome to my other publishing channels