新电脑搭建博客

如果你希望在年老时受人爱戴，那麽在你年轻之时就应待人有礼。——黎里

昨天重装了电脑

不如复习一遍hexo博客搭建，也给大伙整点活

现在这台电脑开发环境也没装，那么从头开始搭一把

首先准备一台能联网的电脑

打开浏览器，IE浏览器也行

跳转到nodejs官网

下载node12（14之后会报警告，虽然可以用，但警告看上去很烦。。。）

等待下载完成打开

下载慢的点我这个链接

一直下一步就好了

到这里就对了

然后Win R打开命令行输入cmd打开控制台

代码语言：javascript复制

#查看node版本
node -v
#查看npm版本
npm -v

然后下一步安装cnpm

代码语言：javascript复制

npm install -g cnpm --registry=https://registry.npm.taobao.org

代码语言：javascript复制

#查看版本
cnpm -v

然后安装hexo

代码语言：javascript复制

#安装hexo-cli
cnpm install hexo-cli -g

然后是下载git

git官网下载

说实话下载是真的慢。。。

建议是从腾讯的软件管理中去下载，这个下载的快

瞬间就好了

一直点击next

我们这时候创建一个目录

双击进去，右键git bash here

先配置一下用户名、邮箱什么的吧

代码语言：javascript复制

#设置用户名
git config --global user.name "username"
#设置邮箱
git config --global user.email useremail@qq.com 

输入hexo init

稍加等待

我们再输入

代码语言：javascript复制

#本地启动
hexo s

进入localhost:4000

发现成功访问

接下来是部署，这里介绍gitee部署方式

注册帐号

创建仓库

把url复制下来

来到我们的博客目录，找到_config.yml

拉到最下面进行配置

一定要注意空格!!!

代码语言：javascript复制

deploy:
  type: git
  repo: https://gitee.com/rubenhappyachao/rubenhappyachao.git
  branch: master

然后别忘了Ctrl S保存

输入hexo g

先输入

代码语言：javascript复制

#安装git插件
cnpm install --save hexo-deployer-git

再输入hexo d

输入用户名和密码，点击确定，注意别输入错了，错了的话得去控制面板里的凭据管理中删除

这样就成功了

刷新仓库

我们点击右边的服务，选择Gitee Pages

对了，需要先绑定手机号哦~

然后回到刚才的页面刷新一下，发现已经没有提示了

点击启动

好了之后

点击网址进去

发现成功访问

我们这时候来更改主题吧

首先挑选一个主题

主题挑选网址

比如我现在用的这个

跟着说明一步一步走，不同的主题配置方式可能略微不同

代码语言：javascript复制

git clone https://github.com/ZEROKISEKI/hexo-theme-gal.git themes/gal

下载完成后

代码语言：javascript复制

cnpm install hexo-renderer-sass --save

然后

代码语言：javascript复制

cnpm install hexo-renderer-scss --save

代码语言：javascript复制

cnpm install hexo-generator-json-content --save

然后进入_config.yml

粘贴

代码语言：javascript复制

jsonContent:
  dateFormat: MM-DD
  pages:
    title: true
    text: true
    path: true
    date: true
    excerpt: true
    preview: true
  posts:
    title: true
    text: true
    path: true
    date: true
    excerpt: true
    tags: [{
      name: tag.name,
      slug: tag.slug,
      permalink: tag.permalink
    }]
    preview: true

并且修改主题为gal，保存

修改配置文件其他部分

最终配置文件

代码语言：javascript复制

# Hexo Configuration
## Docs: https://hexo.io/docs/configuration.html
## Source: https://github.com/hexojs/hexo/

# Site
title: 阿超
subtitle: ''
description: '​ 我的名字叫阿超，19岁。住在华府大道的住宅区一带，未婚。我在一家普通公司做java开发。每天都要加班到晚上9点才能回家。我不抽烟，酒仅止于浅尝。晚上12点睡，每天要睡足8个小时。睡前，我一定看半小时《JOJO的奇妙冒险》漫画，然后做50个仰卧起坐，上了床，马上熟睡。一觉到天亮，决不把疲劳和压力，留到第二天。医生都说我很正常。'
keywords:
author: 阿超
language: zh-CN
timezone: ''

# URL
## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
url: https://rubenhappyachao.gitee.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

# Directory
source_dir: source
public_dir: public
tag_dir: tags
archive_dir: archives
category_dir: categories
code_dir: downloads/code
i18n_dir: :lang
skip_render:

# Writing
new_post_name: :title.md # File name of new posts
default_layout: post
titlecase: false # Transform title into titlecase
external_link:
  enable: true # Open external links in new tab
  field: site # Apply to the whole site
  exclude: ''
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: ''
  wrap: true
  hljs: false

# Home page setting
# path: Root path for your blogs index page. (default = '')
# per_page: Posts displayed per page. (0 = disable pagination)
# order_by: Posts order. (Order by date descending by default)
index_generator:
  path: ''
  per_page: 10
  order_by: -date

# Category & Tag
default_category: uncategorized
category_map:
tag_map:

# Metadata elements
## https://developer.mozilla.org/en-US/docs/Web/HTML/Element/meta
meta_generator: true

# Date / Time format
## Hexo uses Moment.js to parse and display date
## You can customize the date format as defined in
## http://momentjs.com/docs/#/displaying/format/
date_format: YYYY-MM-DD
time_format: HH:mm:ss
## Use post's date for updated date unless set in front-matter
use_date_for_updated: false

# Pagination
## Set per_page to 0 to disable pagination
per_page: 10
pagination_dir: page

# Include / Exclude file(s)
## include:/exclude: options only apply to the 'source/' folder
include:
exclude:
ignore:

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

# Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
  type: git
  repo: https://gitee.com/rubenhappyachao/rubenhappyachao.git
  branch: master
#
#
#
#
#
#
# Header
menu:
  Home: /
  Archives: /archives
  Categories: /categories
  Tags: /tags
rss: /atom.xml

# Content
excerpt_link: Read More
fancybox: true

# Sidebar
sidebar: left
widgets:
- nav
- about

# display widgets at the bottom of index pages (pagination == 2)
index_widgets:
# - category
# - tagcloud
# - archive

# widget behavior
archive_type: 'monthly'
show_count: false

# Miscellaneous
google_analytics:
favicon: /favicon.png
twitter:
google_plus:
fb_admins:
fb_app_id:


# GalMenu - PC端右键调出，移动端长按
# galmenu决定是否开启
# mp3play决定是否开启音效
galmenu: true
mp3play: false
gaymenu_item:
- name: 首页
  url : /
- name: 标签
  url : /tags
- name: 分类
  url : /categories
- name: 归档
  url : /archives
- name: xxx
  url : xxxxxxxxx
- name: xxxx
  url : xxxxxxx

# 社交链接
social:
- url: http://github.com/ShanaMaid
  name: Github

# 友情链接
# name : url
link_title: 友情链接
links:
  ShanaMaid: https://www.baidu.com/s?wd=如何交朋友&rsv_spt=1&rsv_iqid=0xeded6b3100005af5&issp=1&f=8&rsv_bp=1&rsv_idx=2&ie=utf-8&tn=baiduhome_pg&rsv_enter=1&rsv_dl=tb&rsv_sug3=19&rsv_sug1=8&rsv_sug7=100&rsv_sug2=0&rsv_btype=i&inputT=3914&rsv_sug4=9210


# Sidebar Avatar
# in theme directory(source/images): /images/avatar.jpg
# in site  directory(source/uploads): /uploads/avatar.jpg
# 头像
avatar: https://waibi.oss-cn-chengdu.aliyuncs.com/2020-06-01/head.jpg


# 网站统计
# 站长统计 填写id
# eg:　
# CNZZ: 123456789
CNZZ: 

# 评论
# 评论
# 友言uid
uyan: 

# leadcloud访问次数统计
# 
leancloud_visitors:
  enable: false
  app_id: 
  app_key: 
#  
# 
#
# hexo/_config.yml
markdown_it_plus:
  highlight: true
  html: true
  xhtmlOut: true
  breaks: true
  langPrefix:
  linkify: true
  typographer:
  quotes: “”‘’
  pre_class: highlight
# 搜索
search:
  path: search.xml
  field: post
  format: html
  limit: 10000
#gal主题配置
jsonContent:
  dateFormat: MM-DD
  pages:
    title: true
    text: true
    path: true
    date: true
    excerpt: true
    preview: true
  posts:
    title: true
    text: true
    path: true
    date: true
    excerpt: true
    tags: [{
      name: tag.name,
      slug: tag.slug,
      permalink: tag.permalink
    }]
    preview: true

最后输入

代码语言：javascript复制

hexo new page "search"              // 搜索功能的必须步骤
hexo new page "404"                 // 开启404页面

我们可以测试一下了，输入hexo s本地运行一下

可以看到已经切换成功了

我们新建一篇博客

代码语言：javascript复制

hexo new "博客搭建"

到目录下的source->_posts下就看到我们刚刚新建的md文件了

我们这时候安装typora并和picgo整合

看我这篇博客就行

用typora PicGo写博客

弄好了打开

我们随便写点什么

Ctrl S保存

然后

代码语言：javascript复制

hexo g
hexo d

完成后我们再去gitee中点一下部署

然后再访问一遍

点进去看看，好没有问题

如果样式崩了或者其他问题什么的，看看控制台报错没有，或者配置文件写错没有

就到这里啦~

hexo git node.js

0 人点赞