码云+Hexo 搭建简单的个人博客

本文目的记录学习个人博客搭建方法和过程。

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

主题库:https://hexo.io/themes/

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 ##上传至服务器
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容