HEXO framework to build a personal blog

1. Environment construction

1. nodejs installation

1.1 Download

Download address (choose the stable version of LTS ): https://nodejs.org/en/

After downloading, install directly by default, all the way to next (it is recommended not to put it on the C drive)

1.2 Test nodejs

Open windows command line tool input

node -v
Copy

The installation is successful if the version number is displayed

1.3 Test npm

# npm是nodejs安装时默认安装的
# 直接在windows的命令行工具输入
npm -v
Copy

If the following is displayed, the installation is successful, and the npm management tool is used to install the Hexo framework

1.4 Install nrm (requires a little patience)

The reason for the installation of nrm: Need to switch the download source to the domestic mirror source to improve the download speed

By default, the global installation path of npm is on the C drive. We need to modify to the nodejs installation directory and create two new folders: node_global_modulesandnode_cache

Execute the following two commands on the command line to modify the npm configuration

npm config set prefix "D:\Java\nodejs\node_modules\npm\node_global_modules"
npm config set cache "D:\Java\nodejs\node_modules\npm\node_cache"
Copy

Enter the following command after execution to view the npm configuration results
```
npm config ls
Copy
```

After verifying the configuration is successful, you need to configure environment variables. In the environment variable, create a new system variable, variable name:, NODE_HOMEvariable value:, the D:\dev\nodejseffect is as shown in the figure:

In the system environment variable Pathvariable name, create a new variable value:

%NODE_HOME%
%NOED_HOME%\node_modules
%NODE_HOME%\node_modules\npm\node_global_modules\
Copy

The effect is as follows:

Reopen the command line tool after saving, perform global installation
```
npm install nrm -g
Copy
```
After the installation is over, as shown in the figure:
Enter instructions on the command line to view the download source, and an error may be reported as shown in the figure below:
```
nrm ls
Copy
```

Find the nrm directory (the fourth line of the error)

at Object.<anonymous> (D:\Java\nodejs\node_modules\npm\node_global_modules\node_modules\nrm\cli.js:17:20)
Copy

Open line 17 of cli.js and modify it to

//const NRMRC = path.join(process.env.HOME, '.nrmrc'); (删除)
const NRMRC = path.join(process.env[(process.platform == 'win32') ? 'USERPROFILE' : 'HOME'], '.nrmrc');
Copy

Re-enter to nrm lsview the download source
Modify the download source instruction, recommend taobao
```
nrm use taobao # 选择淘宝
Copy
```

2. Install the Hexo framework

2.1 Install hexo-cli scaffolding

Open command line input

npm i -g hexo-cli
Copy

The installation is successful as shown in the figure:

2.2 Verify the successful installation of hexo-cli

Command line input test

hexo -v
Copy

The results are shown in the figure:

3. Install Git

For details, please refer to my Git summary

Second, use Hexo to build a blog

1. Create project folder

Create and enter the project folder (blog) on the local hard disk, and open the command line tool in the folder

2. Initialize the blog project

Initialize the project with the hexo command

hexo init
Copy

The initialization project file is shown in the figure:

3. Run the hexo service to preview the blog

Enter the command in the current path

hexo s
Copy

The access path appears on the command line, just click to access

The default style is shown in the figure:

4. Create Article

Enter the command in the current path

hexo n 'hexo test'
Copy

After the carriage return, the path of the .md file named after the title appears, open the file to edit the content of the article

5. Update the article

Command line input

hexo clean # 清理缓存
hexo g # 解析生成
hexo s # 运行hexo服务预览博客
Copy

3. Deploy the blog to GitHub

1. Log in to GitHub to create a warehouse

Create a warehouse command: git_name.github.io (note the first one. The account name must be in front)

2. Install the git deployment plugin in the local directory

Open the command line tool in the project root directory and enter the following

npm install --save hexo-deployer-git # --save 表示只在本目录下安装
Copy

3. Modify the configuration file in the project root directory

_config.yamlFile found

Find the bottom deploy：typeto edit:

# Deployment
## Docs: https://hexo.io/docs/one-command-deployment
deploy:
  type: 'git'
  repo: https://github.com/git_name/git_name.github.io.git 
  # repo : github上创建的仓库地址
  branch: master
Copy

4. Deploy to GitHub

Open the command line input in the project root directory

hexo d
Copy

You are prompted to enter your GitHub account and password and submit the code to the GitHub repository

The blog can be accessed via the GitHub link

Fourth, change the theme

1. Download themes

Download the theme file to the themefolder of the local project

Open the command line input in the root directory of the local project

git clone https://github.com/fluid-dev/hexo-theme-fluid.git themes/fluid
Copy

2. Modify the configuration _config.yml

Find #Extensionsthe theme of the item

# Extensions
## Plugins: https://hexo.io/plugins/
## Themes: https://hexo.io/themes/
theme: fluid
Copy

3. Update and redeploy

hexo clean # 清理缓存
hexo g # 解析生成
hexo s # 运行hexo服务预览
hexo d # 部署到github
/fluid
Copy

2. Modify the configuration _config.yml

Find #Extensionsthe theme of the item

# Extensions
## Plugins: https://hexo.io/plugins/
## Themes: https://hexo.io/themes/
theme: fluid
Copy

3. Update and redeploy

hexo clean # 清理缓存
hexo g # 解析生成
hexo s # 运行hexo服务预览
hexo d # 部署到github