王柳 发表于 2024-5-18 12:20:14

又重新搭了个个人博客

哈喽大家好,我是咸鱼。
前段时间看到一个学弟写了篇用 Hexo 搭建博客的教程,心中沉寂已久的激情重新被点燃起来。(从前搞过一个个人网站,但是因为种种缘故原由最后不了了之)
https://files.mdnice.com/user/53232/5d9e4fed-2137-4934-a6d8-81a7b0034198.png
于是花了一天时间参考教程搭了个博客网站,我的博客网址是:https://xxxsalted.github.io/
https://files.mdnice.com/user/53232/d95671c2-eb1b-4439-a938-79fc1b019483.png
下面是相关教程。
环境准备

俗话说:"工欲善其事必先利其器",在搭建个人博客之前我们先要把环境准备好。

[*]Github 准备
作为全球最大的程序员同性交友网站(不是),我们首先创建一个 Github 账号,官网地址:https://github.com
然后我们下载并安装 Git,官网地址: https://git-scm.com/downloads
毕竟是国外地址,我们访问起来可能比较慢,这时间我们可以访问下面的地址来下载
https://registry.npmmirror.com/binary.html?path=git-for-windows/v2.42.0.windows.2/https://files.mdnice.com/user/53232/4b8e7ae5-a8c3-4398-8894-bfa8d77a5553.png

[*]Node.js 准备
Node.js 简单来讲是一个 JavaScript 的运行环境,让我们的 JavaScript 代码不需要在欣赏器上也能运行。
下载安装 Nodejs:http://nodejs.cn/download/

[*]环境配置
下载安装好 Git 和 Node.js 之后,我们在键盘上按下 win+R 键,输入 cmd。
https://files.mdnice.com/user/53232/b0a8dd2c-b35c-42a8-a996-b413988784c1.png
然后在弹出的 cmd 窗口中输入下面的命令,来检验是否安装乐成
git --version

npm version

[*]下载 cnpm
npm 是 Node.js 的安装包管理器,但是由于限定我们有时间通过 npm 下载东西会特别的慢,这时间我们就需要换一个国内的下载源并且使用 cnpm 来管理 Node.js。
npm install -g cnpm --registry=https://registry.npmmirror.com初始化博客


[*]安装 Hexo
接下来我们要安装 Hexo ,还是在刚刚弹出的 cmd 窗口中输入:
cnpm install -g hexo

[*]创建新文件夹
我们在电脑任意位置创建一个新文件夹(最好别放在 C 盘下且文件名是英文),这个文件夹将用于储存你网站的静态文件。
好比说我的新建文件夹路径如下:
E:\myblog然后右键鼠标,打开Git Bash Here,并依次输入以下命令:
https://files.mdnice.com/user/53232/bb5575a4-afee-4c46-a50d-b54b3ade067b.png
# 初始化 hexo
hexo init

# 生成网页文件
hexo generate

# 部署到本地上
hexo serverhttps://files.mdnice.com/user/53232/c812ee7d-f89b-406a-afd1-293eee183a33.png
在执行命令的时间出现权限相关问题(npm ERR! { Error: EPERM: operation not permitted, mkdir 'C:\Program Files\nodejs\node_cache\_locks'),可以参考下面这篇文章来办理:
https://www.cnblogs.com/yinxiangzhenlihai/p/15936518.html
然后你会发现你的目次下面多了许多文件:
https://files.mdnice.com/user/53232/b11b1845-32bf-4c56-a6a1-978da987ee34.png
接着打开下面网址验证一下:
http://localhost:4000/https://files.mdnice.com/user/53232/a2f9e595-b4b4-417c-ad23-18c806489cae.png
假如你想停止运行,可以在上面的 bash 命令窗口中执行 Ctrl+C 命令。
到现在我们的个人博客就完成了一半了!
托管至 GitHub


[*]仓库创建
我们登录自己的 Github ,然后在 Github 中新建一个仓库。
https://files.mdnice.com/user/53232/e27077da-fde9-4781-b329-82398b44bd7c.png
留意: Repository name一定要按照图片上的格式填写,其他的默认即可。
https://files.mdnice.com/user/53232/838c9230-68d1-4982-bcbe-f51c9b7eb628.png

[*]设置免密登录
为了方便我们本地与 Github 互相通讯,我们需要设置 SSH 免密登录。
首先找到你的 Github 邮箱和用户名,然后在你个人博客的文件夹下右键鼠标,打开Git Bash Here,并依次输入以下命令:
git config --global user.name "github 用户名"

git config --global user.email "github 邮箱"然后我们检验一下:
git config user.name
git config user.email接着我们在键盘上按下 win+R 键,输入 cmd,在 cmd 窗口里面输入下面的命令:
# 检查本机是否已经存在 SSH 密钥
cd ~/.ssh假如提示:No such file or directory 则输入如下代码,生成 SSH 文件:
ssh-keygen -t rsa -C "github 邮箱地址"然后连续敲 3 次回车,终极会生成一个文件在“用户”目次下,打开 “用户” 目次(C:\用户\用户名.ssh)并找到id_rsa.p ub文件。
用“记事本”打开并复制里面的内容,在Github 主页的右上角进入 Setting -> 左侧菜单栏 “SSH and GPG keys” -> New SSH Key -> 填写你得到的 SSH Key。
https://files.mdnice.com/user/53232/a9d8ac30-3d6b-4459-b2fa-8edf60c35eae.png
https://files.mdnice.com/user/53232/ecff2506-f295-40f5-86e7-208cf394d507.png
https://files.mdnice.com/user/53232/5696512f-1fc3-4749-a096-9e00f3b0786b.png
部署博客

到了这一步,我们就可以正式地把博客部署到 Git 上了,进入我们前面创建的博客文件夹,然后找到配置文件 _config.yml。
https://files.mdnice.com/user/53232/5f51a4e7-0e9d-40d6-9deb-6e712750f13a.png
下面是我的配置文件的部分内容,大家可以参考一下
部署路径部分:
deploy:
type: git
repo: 你的 git 仓库地址
branch: master网站相关部分:
# Site
title: Amoon's blog
subtitle: ''
description: ''
keywords:
author: Ammon
language: zh-CN
timezone: 'Asia/shanghai'


## Set your site url here. For example, if you use GitHub Page, set url as 'https://username.github.io/project'
url:https://xxxsalted.github.io
root: /
permalink: :year/:month/:day/:title/
permalink_defaults:
pretty_urls:
trailing_index: true # Set to false to remove trailing 'index.html' from permalinks
trailing_html: true # Set to false to remove trailing '.html' from permalinks我们还需要安装一个插件,打开 Git bash 窗口
# 安装自动部署工具
cnpm install hexo-deployer-git --save 然后依次执行下面的命令
# 清除 public 缓存文件
hexo clean

# 生成新的网站静态文件到默认设置的 public 文件夹,也可以用 hexo g 命令
hexo generate

# 部署到 github,也可以用 hexo d 命令
hexo deploy 当然,在生成静态文件之后你可以使用 hexo s 命令生成一个本地的 hexo 网站来做相关检验和测试,假如没什么问题就使用 hexo d 命令将其部署到 git 上
最后我们的博客就搭建乐成啦!

免责声明:如果侵犯了您的权益,请联系站长,我们会及时删除侵权内容,谢谢合作!更多信息从访问主页:qidao123.com:ToB企服之家,中国第一个企服评测及商务社交产业平台。
页: [1]
查看完整版本: 又重新搭了个个人博客