发表于 | 分类于

环境准备

  1. 安装git 下载地址
  2. 安装Nodejs 下载地址
  3. 添加SSH Key到GitHub

安装cnpm

npm太慢，而且经常失败，使用淘宝镜像：

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

安装hexo

  1. git bash下执行以下命令安装:

    1
    cnpm i -g hexo

  2. 新建目录博客目录:C:/ADEV/myblog

    cd 到myblog并执行以下命令初始化hexo:

    1
    hexo init

    接下来的命令如果不是特意说明，都是在站点目录下执行。

  3. 查看博客雏形:
    1
    2
    3
    hexo clean #清理
    hexo g #生成网页
    hexo s #启动本地服务器

在浏览器中打开http://localhost:4000 ,就可以看到本地博客主页了。

创建文章

Ctrl+C退出hexo服务，执行以下命令创建新的文章:

1
hexo new test

终端会有以下输出:

1
INFO  Created: C:\ADEV\myblog\source\_posts\test.md

Hexo所有的文章都是Markdown文件，以后也可不通过命令，直接在_posts目录下创建新的文章。

美化博客 - 使用Next主题

Hexo有很多第三方主题，研究了一圈，最终决定使用Next。
Next很美观，很成熟，集成了你能想到的所有功能，大部分情况下只需要修改主题配置文件就行了，强烈推荐。

  1. 下载地址: https://github.com/theme-next/hexo-theme-next
  2. 解压到C:/ADEV/myblog/themes目录下，并重命名为next6
  3. 打开站点配置文件C:/ADEV/myblog/_config.yml， 找到theme字段，并将其值更改为next6 
    1
    theme: next6

两个重要的配置文件

构建博客的过程中会经常修改一下两个配置文件:

  1. 站点配置文件：C:/ADEV/myblog/_config.yml
  2. 主题配置文件: C:/ADEV/myblog/themes/next6/_config.yml

发布到GitHub

  1. 创建一个GitHub repository,名称为yourgithubname.github.io（yourgithubname替换为你的GitHub账户名）

  2. 修改站点配置文件:

    1
    2
    3
    4
    deploy:
      type: git
      repo: https://github.com/yourgithubName/yourgithubName.github.io.git
      branch: master

    注意格式，子项前面有两个空格，冒号后面有一个空格。
    如果接下来发布出错，请尝试将repo修改成以下形式:

    1
    repo: git@github.com:yourgithubName/yourgithubName.github.io.git

  3. 安装发布模块:

    1
    npm install hexo-deployer-git --save

  4. 执行以下命令发布:

    1
    2
    3
    hexo clean
    hexo g
    hexo d #发布

    在浏览器访问https://yourgithubname.github.io ,就可以看到你的博客了。

站点配置:

以下配置请查找关键字修改。

  1. 语言改为中文: 

    1
    language: zh-CN

    注意在你的主题language目录下应该包含你所配置的语言配置文件，本例为:C:/ADEV/myblog/themes/next6/languages/zh-CN.yml。
    Next不同版本中文配置名字可能不一样，有的版本是zh-Hans，请根据具体情况配置。

  2. 标题&作者:

    1
    2
    title: 善生的个人博客
    author: 善生

  3. URL唯一化:

    1. 安装模块:

      1
      cnpm install hexo-abbrlink --save

    2. 修改配置:

      1
      2
      3
      4
      5
      6
      7
      # URL
      permalink: post/:abbrlink.html  
      permalink_defaults:  

      abbrlink:  
      alg: crc32  # 算法：crc16(default) and crc32  
      rep: hex    # 进制：dec(default) and hex

  4. 自定义博文文件名格式（添加日期前缀，方便管理）:

    1
    2
    # Writing
    new_post_name: :year:month:day-:title.md # File name of new posts

  5. 图片文件夹:

    1
    2
    # Writing
    post_asset_folder: true

    使用命令创建新的博文之后,会在博文同一目录下生成和博文同名的文件夹，把图片放入此文件夹下，图片有两种使用方法:

    1
    2
    3
    ![说明](图片.jpg)

    {% asset_img 图片.jpg 说明 %}

主题配置:

  1. 站点日期:

    1
    2
    footer:
      since: 2018

  2. 去掉底部一些链接:

    1
    2
    3
    4
    5
    6
    powered:
      enable: false
      version: false
    theme:
      enable: false
      version: false

  3. 博客标签页面，分类页面:

    1. 执行以下命令:

      1
      2
      hexo new page tags
      hexo new page categories

    2. 修改标签页C:/ADEV/myblog/source/tags/index.md:

      1
      2
      3
      4
      5
      6
      ---
      title: 所有标签
      date: 2018-08-15 22:56:08
      type: "tags"
      comments: false
      ---

    3. 修改分类页C:/ADEV/myblog/source/categories/index.md:

      1
      2
      3
      4
      5
      6
      ---
      title: 所有分类
      date: 2018-08-15 23:04:31
      type: "categories"
      comments: false
      ---

    4. 修改主题配置文件:

      1
      2
      3
      menu:
        tags: /tags/
        categories: /categories/

  4. Next样式:

    Next有四种样式,我使用的是Pisces：

    1
    2
    # Schemes
    scheme: Pisces

  5. 个人GitHub和Email:

    1
    2
    3
    social:
      GitHub: https://github.com/lano2088
      E-Mail: mailto:warrenvip@163.com

  6. 头像:

    将头像图片放到此位置:C:\ADEV\myblog\themes\next6\source\images\main.png，也可以是gif文件。修改主题配置:

    1
    2
    avatar:
      url: /images/main.png

  7. 更改头像最大宽度:

    根据你的头像宽度，修改样式文件:C:/ADEV/myblog/themes/next6/source/css/_variables/Pisces.styl:

    1
    $site-author-image-width          = 220px

    如果你用的是其它样式，请修改对应的文件。

  8. 开启打赏功能:

    将你的微信和支付宝二维码放到主题的images目录下:

    1
    2
    3
    4
    # Rewards
    reward_comment: 欢迎打赏
    wechatpay: /images/wechatpay.png
    alipay: /images/alipay.png

  9. 百度分享:

    1
    2
    baidushare:
      type: button

文章阅读量，访客统计:

编辑主题配置文件:

1
2
3
4
5
6
7
8
busuanzi_count:
  enable: true
  total_visitors: true
  total_visitors_icon: user
  total_views: true
  total_views_icon: eye
  post_views: true
  post_views_icon: eye

集成第三方评论功能

第三方评论插件有很多，但是好用的不多。尝试过用来必力，但是注册失败了。看了下畅言，需要绑定备案的域名，不支持GitHub，好像免费版还有广告。最后决定使用gitment,他是借助了GitHub的issues功能实现的。好像可以实现有评论发送邮件，如果有自己的域名，再绑定腾讯企业邮箱，可以实现微信推送,具体还没研究。

gitment示例页面: https://imsun.github.io/gitment/

  1. 注册 GitHub OAuth Application

    点击此处 来注册一个新的 OAuth Application。其他内容可以随意填写，但要确保填入正确的 Authorization callback URL（一般是评论页面对应的域名，如 https://lano2088.github.io 或者个人域名：http://lanovip.xyz ，多个站点不能共用）。

    你会得到一个 client ID 和一个 client secret，这个将被用于之后的用户登录。

  2. 编辑主题配置文件: 
    1
    2
    3
    4
    5
    6
    gitment:
      enable: true
      github_user: your_github_name # MUST HAVE, Your Github Username
      github_repo: your_comment_repo # MUST HAVE, The name of the repo you use to store Gitment comments
      client_id: your_client_id # MUST HAVE, Github client id for the Gitment
      client_secret: your_client_secret # EITHER this or proxy_gateway, Github access secret token for the Gitment

每篇文章发布之后需要到文章页面底部用你的GitHub账户登录，初始化评论。虽然有点麻烦，个人觉得还好。毕竟个人博客文章量有限。网上有批量初始化方法，请自行百度。

博客搜索功能

  1. 安装模块:

    1
    cnpm install hexo-generator-searchdb --save

  2. 修改站点配置:

    1
    2
    3
    4
    5
    6
    # 搜索
    search:
    path: search.xml
    field: post
    format: html
    limit: 10000

  3. 修改主题配置:

    1
    2
    local_search:
        enable: true

修改文章内链接文本样式

修改文件 themes\next6\source\css_common\components\post\post.styl，在末尾添加如下css样式：

1
2
3
4
5
6
7
8
9
10
11
// 文章内链接文本样式
.post-body p a{
  color: #0593d3;
  border-bottom: none;
  border-bottom: 1px solid #0593d3;
  &:hover {
    color: #fc6423;
    border-bottom: none;
    border-bottom: 1px solid #fc6423;
  }
}

其中选择.post-body 是为了不影响标题，选择 p 是为了不影响首页“阅读全文”的显示样式,颜色可以自己定义。

压缩发布 - 优化博客加载速度

在站点的根目录下执行以下命令：

1
2
cnpm install gulp -g
cnpm install gulp-minify-css gulp-uglify gulp-htmlmin gulp-htmlclean gulp --save

新建 gulpfile.js ，并填入以下内容：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
var gulp = require('gulp');
var minifycss = require('gulp-minify-css');
var uglify = require('gulp-uglify');
var htmlmin = require('gulp-htmlmin');
var htmlclean = require('gulp-htmlclean');
// 压缩 public 目录 css
gulp.task('minify-css', function() {
    return gulp.src('./public/**/*.css')
        .pipe(minifycss())
        .pipe(gulp.dest('./public'));
});
// 压缩 public 目录 html
gulp.task('minify-html', function() {
  return gulp.src('./public/**/*.html')
    .pipe(htmlclean())
    .pipe(htmlmin({
         removeComments: true,
         minifyJS: true,
         minifyCSS: true,
         minifyURLs: true,
    }))
    .pipe(gulp.dest('./public'))
});
// 压缩 public/js 目录 js
gulp.task('minify-js', function() {
    return gulp.src('./public/**/*.js')
        .pipe(uglify())
        .pipe(gulp.dest('./public'));
});
// 执行 gulp 命令时执行的任务
gulp.task('default', [
    'minify-html','minify-css','minify-js'
]);

生成博文时执行hexo g && gulp就会根据gulpfile.js中的配置，对public目录中的静态资源文件进行压缩。

七牛云CDN加速

把图片放到七牛云上面，生成外链，可以优化博客访问速度。七牛云的免费流量完全可以满足个人博客的需求。

参考链接:

  1. Next官网
  2. Next酷炫效果
  3. Markdown语法
  4. 如何优雅的发布hexo博客
  5. Gitment：使用 GitHub Issues 搭建评论系统

发表于 | 更新于

安装nginx:

sudo apt-get install nginx

启动nginx服务:

1
sudo service nginx start

在浏览器上输入网址：http://127.0.0.1，就可以看到nginx默认主页了。

nginx配置:

查看主配置文件:/etc/nginx/nginx.conf:

1
2
3
4
5
http {
	...省略
	include /etc/nginx/conf.d/*.conf;
	include /etc/nginx/sites-enabled/*;
}

可以看到http服务包含以上两个目录下的配置文件。
我目前只需要起一个服务端口，所以直接修改默认80配置文件里面的静态网页路径:/etc/nginx/sites-enabled/default:

1
root ~/dev/myblog/public;

重启nginx服务:

1
sudo service nginx restart

完成。

nginx常用命令:

1
sudo service nginx {start|stop|restart|reload|force-reload|status|configtest|rotate|upgrade}

发表于 | 更新于

git本地忽略文件

使用.gitignore忽略文件，会从远程仓库中将文件直接删除。如果想保留远程仓库的文件，仅仅在本地忽略一些文件，例如一些配置文件，则可以使用以下命令：
git update-index --assume-unchanged filename

发表于 | 更新于

树莓派3B+ apt-get update 出错记录

sudo apt-get update 出错:

1
2
3
4
5
6
7
8
E: 无法下载 http://101.44.1.125/files/B11600000762A811/mirrors.zju.edu.cn/debian/dists/stretch/main/binary-armhf/Packages.gz  Writing more data than expected (184092 > 174269)
   Hashes of expected file:
    - Filesize:174269 [weak]
    - SHA256:949a940146e8a41829afee9a301507d59389c27c82d7a42eba4523b121648980
    - SHA1:1b4f8b91ab3041de7eba7c4b5c1c9d3e20000967 [weak]
    - MD5Sum:2e03359b53821e9e71414a2c1f579c75 [weak]
   Release file created at: Wed, 05 Sep 2018 15:09:54 +0000
E: 部分索引文件下载失败。如果忽略它们，那将转而使用旧的索引文件。

更镜像源地址为中国科技大学:

  1. sudo nano /etc/apt/sources.list

    原文件:

    1
    2
    3
    deb http://raspbian.raspberrypi.org/raspbian/ stretch main contrib non-free rpi
    # Uncomment line below then 'apt-get update' to enable 'apt-get source'
    # deb-src http://raspbian.raspberrypi.org/raspbian/ stretch main contrib non-free rpi

    修改为:

    1
    2
    3
    4
    5
    deb http://mirrors.ustc.edu.cn/raspbian/raspbian/ stretch main contrib non-free rpi
    deb-src http://mirrors.ustc.edu.cn/raspbian/raspbian/ stretch main contrib non-free rpi
    # deb http://raspbian.raspberrypi.org/raspbian/ stretch main contrib non-free rpi
    # Uncomment line below then 'apt-get update' to enable 'apt-get source'
    # deb-src http://raspbian.raspberrypi.org/raspbian/ stretch main contrib non-free rpi

    注意实际上只是把网址变了，后面部分不变，因为我看到以前的系统后面部分是不一样的。

  2. sudo nano /etc/apt/sources.list.d/raspi.list
    原文件:

    1
    2
    3
    deb http://archive.raspberrypi.org/debian/ stretch main ui
    # Uncomment line below then 'apt-get update' to enable 'apt-get source'
    #deb-src http://archive.raspberrypi.org/debian/ stretch main ui

    修改为:

    1
    2
    3
    4
    5
    deb http://mirrors.ustc.edu.cn/archive.raspberrypi.org/debian/ stretch main ui
    deb-src http://mirrors.ustc.edu.cn/archive.raspberrypi.org/debian/ stretch main ui
    # deb http://archive.raspberrypi.org/debian/ stretch main ui
    # Uncomment line below then 'apt-get update' to enable 'apt-get source'
    #deb-src http://archive.raspberrypi.org/debian/ stretch main ui

再次尝试更新:

sudo apt-get update 没问题。
sudo apt-get upgrade出错:

1
2
3
4
5
6
7
8
9
10
11
12
E: 无法下载 http://mirrors.ustc.edu.cn/archive.raspberrypi.org/debian/pool/main/f/ffmpeg/libavutil55_3.2.10-1~deb9u1+rpt2_armhf.deb  Hash 校验和不符
   Hashes of expected file:
    - SHA256:7461952290100c547db476ac7e2b3b727808a12060b0811490b42f2ad5f014d0
    - SHA1:f79cb9b0ccf2375268fa9f27d60e8b1032a2ad77 [weak]
    - MD5Sum:97cebd03678913ec7777cdc09602460b [weak]
    - Filesize:234328 [weak]
   Hashes of received file:
    - SHA256:39043f5c516b326e2ced462aa3429c117c29831773e77440888c033c611ee3d0
    - SHA1:bf444ace211d2f455b9cee540055786e6fd6bb6b [weak]
    - MD5Sum:e6b2bd3e40e2c90651562ff882aa7d3f [weak]
    - Filesize:234328 [weak]
   Last modification reported: Wed, 01 Aug 2018 11:56:50 +0000




1
E: 无法下载 http://mirrors.ustc.edu.cn/archive.raspberrypi.org/debian/pool/main/f/ffmpeg/libavcodec57_3.2.10-1~deb9u1+rpt2_armhf.deb  无法发起与 mirrors.ustc.edu.cn:80 (2001:da8:d800:95::110) 的连接 - connect (101: 网络不可达) [IP: 2001:da8:d800:95::110 80]

再次修改配置

怀疑是/etc/apt/sources.list和/etc/apt/sources.list.d/raspi.list里面配置的源不一致，网上查了下sources.list.d目录下是配置第三方软件源。部里面内容全部注释掉，再次更新:
sudo apt-get update 有很多更新
sudo apt-get upgrade 没有任何软件升级，不知道对不对，但是至少没有错误了：

1
2
3
4
5
正在读取软件包列表... 完成
正在分析软件包的依赖关系树       
正在读取状态信息... 完成       
正在计算更新... 完成
升级了 0 个软件包，新安装了 0 个软件包，要卸载 0 个软件包，有 0 个软件包未被升级。

发表于 | 更新于 | 分类于

网站备案注意事项

网站备案需要进行两次：

  1. 管局审核
  2. 公安备案

管局备案注意事项：

  1. 需要申请幕布拍照，或者去指定地点拍照，上海地区有专门的APP认证可替代幕布。

公安备案注意事项:

  1. 提交身份证照片不能大于400k，正常照片用美图秀秀转换一下能变得很小。
  2. 上海地区需要将身份证和居住证一起拍照上传。
  3. 网站底部需要有ICP主体备案号，就是管局备案完成给的。
  4. 网站不能是交互式网站，否则很难审核通过。例如有评论功能。
  5. 如果申请都不通过请果断电话联系网警，省的浪费时间，因为审核不通过的短信没有太多信息。