本文目的记录学习个人博客搭建方法和过程。
1、码云是什么?
码云 ( gitee.com )
代码托管·协作开发平台,开发者超过 300 万,托管项目超过 500 万,汇聚几乎所有本土原创开源项目,并于 2016 年推出企业版,提供企业级代码托管服务,成为开发领域领先的 SaaS 服务提供商。
2、Hexo是什么?
Hexo
一个快速, 简洁且高效的博客框架. 让上百个页面在几秒内瞬间完成渲染. 具有强大的插件整合系统.
3、在码云上创建项目
1.png
4、部署博客构建环境
4.1 系统环境
[root@lixx ~]# cat /etc/redhat-release
CentOS Linux release 7.6.1810 (Core)
4.2 安装 git
[root@lixx ~]# yum install git -y
4.3 安装 node.js:
https://github.com/nodesource/distributions
配置源
[root@lixx ~]# curl --silent --location https://rpm.nodesource.com/setup_12.x | bash -
## Installing the NodeSource Node.js 12.x repo...
## Inspecting system...
+ rpm -q --whatprovides redhat-release || rpm -q --whatprovides centos-release || rpm -q --whatprovides cloudlinux-release || rpm -q --whatprovides sl-release
+ uname -m
## Confirming "el7-x86_64" is supported...
+ curl -sLf -o /dev/null 'https://rpm.nodesource.com/pub_12.x/el/7/x86_64/nodesource-release-el7-1.noarch.rpm'
## Downloading release setup RPM...
+ mktemp
+ curl -sL -o '/tmp/tmp.1ODcCnRP9B' 'https://rpm.nodesource.com/pub_12.x/el/7/x86_64/nodesource-release-el7-1.noarch.rpm'
## Installing release setup RPM...
+ rpm -i --nosignature --force '/tmp/tmp.1ODcCnRP9B'
## Cleaning up...
+ rm -f '/tmp/tmp.1ODcCnRP9B'
## Checking for existing installations...
+ rpm -qa 'node|npm' | grep -v nodesource
## Run `sudo yum install -y nodejs` to install Node.js 12.x and npm.
## You may also need development tools to build native addons:
sudo yum install gcc-c++ make
## To install the Yarn package manager, run:
curl -sL https://dl.yarnpkg.com/rpm/yarn.repo | sudo tee /etc/yum.repos.d/yarn.repo
sudo yum install yarn
[root@lixx ~]# cat /etc/yum.repos.d/nodesource-el7.repo
[nodesource]
name=Node.js Packages for Enterprise Linux 7 - $basearch
baseurl=https://rpm.nodesource.com/pub_12.x/el/7/$basearch
failovermethod=priority
enabled=1
gpgcheck=1
gpgkey=file:///etc/pki/rpm-gpg/NODESOURCE-GPG-SIGNING-KEY-EL
[nodesource-source]
name=Node.js for Enterprise Linux 7 - $basearch - Source
baseurl=https://rpm.nodesource.com/pub_12.x/el/7/SRPMS
failovermethod=priority
enabled=0
gpgkey=file:///etc/pki/rpm-gpg/NODESOURCE-GPG-SIGNING-KEY-EL
gpgcheck=1
安装
[root@lixx ~]# yum install nodejs -y
4.4 部署Hexo
使用 npm 安装 hexo :
[root@lixx ~]# npm install hexo-cli -g
/usr/bin/hexo -> /usr/lib/node_modules/hexo-cli/bin/hexo
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.9 (node_modules/hexo-cli/node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.9: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
+ hexo-cli@2.0.0
added 187 packages from 433 contributors in 127.419s
5、构建个人博客
5.1 使用 hexo 快速初始化一个博客框架
[root@lixx ~]# hexo init blog-demo
INFO Cloning hexo-starter https://github.com/hexojs/hexo-starter.git
正克隆到 '/root/blog-demo'...
remote: Enumerating objects: 77, done.
remote: Total 77 (delta 0), reused 0 (delta 0), pack-reused 77
Unpacking objects: 100% (77/77), done.
子模组 'themes/landscape' (https://github.com/hexojs/hexo-theme-landscape.git) 已为路径 'themes/landscape' 注册
正克隆到 'themes/landscape'...
remote: Enumerating objects: 976, done.
remote: Total 976 (delta 0), reused 0 (delta 0), pack-reused 976
接收对象中: 100% (976/976), 3.18 MiB | 701.00 KiB/s, done.
处理 delta 中: 100% (531/531), done.
子模组路径 'themes/landscape':检出 '73a23c51f8487cfcd7c6deec96ccc7543960d350'
INFO Install dependencies
npm WARN deprecated core-js@1.2.7: core-js@<2.6.8 is no longer maintained. Please, upgrade to core-js@3 or at least to actual version of core-js@2.
npm notice created a lockfile as package-lock.json. You should commit this file.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.9 (node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.9: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
added 340 packages from 501 contributors and audited 6879 packages in 66.358s
found 1 low severity vulnerability
run `npm audit fix` to fix them, or `npm audit` for details
INFO Start blogging with Hexo!
[root@lixx ~]# cd blog-demo/
[root@lixx blog-demo]# ls
_config.yml node_modules package.json package-lock.json scaffolds source themes
简单介绍一下这些文件目录的作用:
- _config.yml : 全局配置文件,部署完后需要修改下这里面的配置。
- package.json:数据库保存在这个里面。
- source: md格式的源文件都在这里面。
- public: 这个文件夹还没有生成,网页都在这里面。
- themes:博客的主题保存路径,每个文件夹一个主题。
5.2 开启博客进行预览
[root@lixx blog-demo]# hexo server
INFO Start processing
INFO Hexo is running at http://localhost:4000 . Press Ctrl+C to stop.
博客默认启动在 4000 端口,打开浏览器访问http://<server ip>:4000
注:如果无法访问的话,请检查防火墙配置。
5.3 更改博客主题
默认使用的主题是landscape,在目录themes/landscape下,更改一个个人喜欢的主题,如hexo-theme-yilia:
[root@lixx blog-demo]# git clone https://github.com/litten/hexo-theme-yilia.git themes/yilia
正克隆到 'themes/yilia'...
remote: Enumerating objects: 1, done.
remote: Counting objects: 100% (1/1), done.
remote: Total 2037 (delta 0), reused 0 (delta 0), pack-reused 2036
接收对象中: 100% (2037/2037), 10.52 MiB | 74.00 KiB/s, done.
处理 delta 中: 100% (1093/1093), done.
[root@lixx blog-demo]# ls themes/
landscape yilia
5.4 个人定制化
编辑 _config.yml
[root@lixx blog-demo]# grep -v ^# _config.yml
title: title
subtitle: subtitle
description: a blog demo
keywords: key
author: lixx
language: zh-CN # default en, select from `themes/landscape/languages/`
timezone: Asia/Shanghai
url: http://yoursite.com/blog-demo
root: /blog-demo
permalink: :year/:month/:day/:title/
permalink_defaults:
source_dir: source
public_dir: public
tag_dir: tags
archive_dir: archives
category_dir: categories
code_dir: downloads/code
i18n_dir: :lang
skip_render:
new_post_name: :title.md # File name of new posts
default_layout: post
titlecase: false # Transform title into titlecase
external_link: true # Open external links in new tab
filename_case: 0
render_drafts: false
post_asset_folder: false
relative_link: false
future: true
highlight:
enable: true
line_number: true
auto_detect: false
tab_replace:
index_generator:
path: ''
per_page: 10
order_by: -date
default_category: uncategorized
category_map:
tag_map:
date_format: YYYY-MM-DD
time_format: HH:mm:ss
per_page: 10
pagination_dir: page
theme: yilia
deploy:
type:
5.5 查看个人定制版页面
图片.png
6、发布个人博客到码云上
配置使用hexo-deployer-git插件,用于将代码推送到码云
[root@lixx blog-demo]# npm install hexo-deployer-git --save
npm WARN babel-eslint@10.0.2 requires a peer of eslint@>= 4.12.1 but none is installed. You must install peer dependencies yourself.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.9 (node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.9: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
+ hexo-deployer-git@1.0.0
added 24 packages from 10 contributors and audited 9166 packages in 11.914s
found 1 low severity vulnerability
run `npm audit fix` to fix them, or `npm audit` for details
再次编辑 blog-demo 目录下 _config.yml 文件,修改deploy 的值
deploy:
type: git
repository: https://gitee.com/lilingxing20/blog-demo.git
branch: master
注:就是在码云上创建的项目地址。
上传到码云
[root@lixx blog-demo]# hexo deploy
INFO Deploying: git
INFO Clearing .deploy_git folder...
INFO Copying files from public folder...
INFO Copying files from extend dirs...
[master(根提交) f511830] Site updated: 2019-08-04 00:30:19
41 files changed, 7414 insertions(+)
create mode 100644 2019/08/03/hello-world/index.html
create mode 100644 archives/2019/08/index.html
create mode 100644 archives/2019/index.html
create mode 100644 archives/index.html
create mode 100644 css/fonts/FontAwesome.otf
create mode 100644 css/fonts/fontawesome-webfont.eot
create mode 100644 css/fonts/fontawesome-webfont.svg
create mode 100644 css/fonts/fontawesome-webfont.ttf
create mode 100644 css/fonts/fontawesome-webfont.woff
create mode 100644 css/images/banner.jpg
create mode 100644 css/style.css
create mode 100644 fancybox/blank.gif
create mode 100644 fancybox/fancybox_loading.gif
create mode 100644 fancybox/fancybox_loading@2x.gif
create mode 100644 fancybox/fancybox_overlay.png
create mode 100644 fancybox/fancybox_sprite.png
create mode 100644 fancybox/fancybox_sprite@2x.png
create mode 100644 fancybox/helpers/fancybox_buttons.png
create mode 100644 fancybox/helpers/jquery.fancybox-buttons.css
create mode 100644 fancybox/helpers/jquery.fancybox-buttons.js
create mode 100644 fancybox/helpers/jquery.fancybox-media.js
create mode 100644 fancybox/helpers/jquery.fancybox-thumbs.css
create mode 100644 fancybox/helpers/jquery.fancybox-thumbs.js
create mode 100644 fancybox/jquery.fancybox.css
create mode 100644 fancybox/jquery.fancybox.js
create mode 100644 fancybox/jquery.fancybox.pack.js
create mode 100644 fonts/default-skin.b257fa.svg
create mode 100644 fonts/iconfont.16acc2.ttf
create mode 100644 fonts/iconfont.45d7ee.svg
create mode 100644 fonts/iconfont.8c627f.woff
create mode 100644 fonts/iconfont.b322fa.eot
create mode 100644 fonts/tooltip.4004ff.svg
create mode 100644 img/default-skin.png
create mode 100644 img/preloader.gif
create mode 100644 img/scrollbar_arrow.png
create mode 100644 index.html
create mode 100644 js/script.js
create mode 100644 main.0cf68a.css
create mode 100644 main.0cf68a.js
create mode 100644 mobile.992cbe.js
create mode 100644 slider.e37972.js
Username for 'https://gitee.com': lilingxing20
Password for 'https://lilingxing20@gitee.com':
Counting objects: 58, done.
Compressing objects: 100% (50/50), done.
Writing objects: 100% (58/58), 653.17 KiB | 0 bytes/s, done.
Total 58 (delta 5), reused 0 (delta 0)
remote: Powered By Gitee.com
To https://gitee.com/lilingxing20/blog-demo.git
+ f7cf72d...f511830 HEAD -> master (forced update)
分支 master 设置为跟踪来自 https://gitee.com/lilingxing20/blog-demo.git 的远程分支 master。
INFO Deploy done: git
博客发布
图片.png
图片.png
图片.png
图片.png
对比前面在本地环境的预览,可以看到一个简单的个人博客已经成功发布在码云上。
7、其他
hexo命令:
- hexo clean ##清理
- hexo g ##构建、编译
- hexo s ##启动服务
- hexo d ##上传至服务器