本文介绍hexo使用grunt实现一些自动化操作。

开发过前端或者node.js的同学对grunt应该不陌生，如果对grunt不熟悉可略过本文。

开始使用hexo来处理静态博客时我就遇到了问题，我的文章已经写了很多篇了，都是markdown格式，而且托管在github上了，然而hexo并不支持导入文章。

好在我发现只要把markdown文件拷贝到hexo里的source/_posts，hexo就会解析，我可以考虑直接把所有文章直接拷贝到这个目录。

但是另外一个问题又出现了，问题在于存在两份一模一样的源文件，一份我托管在github上，一份在source/_posts，后期文章改动的话，两边不同步，维护很费力。

后来想到的方法就是利用自动化工具来处理源文件的拷贝，博客的部署等一些操作。由于对grunt比较熟悉，所以使用了grunt。

如果对grunt不熟悉，可以前往grunt 网站

准备

• 切换到hexo博客目录
• 执行以下命令安装grunt cli： npm install -g grunt-cli
• 执行以下命令安装grunt： npm install grunt --save-dev
• 执行以下命令安装插件：npm install --save-dev grunt-bg-shell grunt-contrib-clean grunt-contrib-copy grunt-contrib-watch grunt-rewrite grunt-zip grunt-shell load-grunt-tasks
• 新建Gruntfile.js
• 新建raw目录

完成后，我的hexo博客里的目录结构是这样子的：

grunt插件说明

以下为使用到的插件：

Gruntfile.js 编写

新建Gruntfile.js，以下是我的Gruntfile.js的内容：

// see: https://gruntjs.com/sample-gruntfile
module.exports = function(grunt) {

  var config = {
    pkg: grunt.file.readJSON('package.json'),
    pathConfig: {
      raw: 'raw',
      posts: 'source/_posts',
    },

    clean: {
      posts: {
        src: ['<%= pathConfig.posts %>/'],
      },
    },

    copy: {
      main: {
        files: [{
          expand: true,
          cwd: '<%= pathConfig.raw %>',
          src: '**/*.md',
          dest: '<%= pathConfig.posts %>',
          flatten: true,
          filter: function(filepath) {
            // var patterns = ['---\ntitle:'];
            var patterns = ['^---$'];
            var matchRegex = function(filepath, patterns) {
              var content = grunt.file.read(filepath);

              return patterns.some(function(pattern){
                var regex = new RegExp(pattern, 'm');
                // var regex = new RegExp(pattern);
                return regex.test(content);
              });
            };
            return matchRegex(filepath, patterns);
          },
        }],
      },
    },

    watch: {
      raw: {
        files: ['<%= pathConfig.raw %>/**/*.md'],
        tasks: ['copy:main'],
        options: {
          // spawn: false,
        },
      },
    },

    bgShell: {
      hexoServer: {
        cmd: 'hexo server',
        bg: true,
      },

    },

    shell: {
      gitClone: {
        command: 'git clone git@github.com:xxxxxxx/my_blog.git <%= pathConfig.raw %>/my_blog'
      },
      gitPullRaw: {
        command: 'cd ./raw/my_blog && git pull'
      },

      hexoGenerate: {
        command: 'hexo g',
      },
      hexoClean: {
        command: 'hexo clean',
      },
    },

    rewrite: {
      abbrlink: {
        src: '<%= pathConfig.raw %>/**/*.md',
        editor: function(contents, filepath){
          const crypto = require('crypto');
          const hash = crypto.createHash('sha256');

          hash.update(contents);
          var hashValue = hash.digest('hex');

          return contents.replace(/abbrlink: 3fb9c7a4f247726d/g, "abbrlink: " + hashValue.substring(0, 16));
        }
      },
    },

    zip: {
      dist: {
        src: [
          'public/**/*',
        ],
        dest: 'blog.zip'
      }
    }

  };

  grunt.initConfig(config);
  require('load-grunt-tasks')(grunt);

  // 运行grunt init 调用此任务
  grunt.registerTask('init', [
    'shell:gitClone'
  ]);

  grunt.registerTask('RawToPosts', [
    'shell:gitPullRaw',
    'rewrite:abbrlink',
    'copy:main',
  ]);

  // 运行 grunt 或者 grunt default 调用此任务
  grunt.registerTask('default', [
    'clean:posts',
    'RawToPosts',
    'bgShell:hexoServer',
    'watch',
  ]);

  // 运行grunt build调用此任务
  grunt.registerTask('build', [
    'clean:posts',
    'RawToPosts',
    'shell:hexoClean',
    'shell:hexoGenerate',
    'zip:dist'
  ]);

};

上述Gruntfile.js中有三个比较重要的任务：

• grunt init
• grunt
• grunt build

grunt init 任务是调用shell:gitClone 把我的博客源文件从github上拉取下来，放到raw/my_blog目录，这个命令只需要执行一次，后期不再需要。

grunt 任务用于日常本地写博客，它的子任务分别是：

• clean:posts: 删除source/_posts下的所有文件
• RawToPosts: 从github拉取更新到raw/my_blog，并拷贝符合条件的文件到source/_posts
• bgShell:hexoServer: 执行hexo server，启动hexo本地服务
• watch: 监测文件变化，辅助hexo server刷新

grunt build 任务用于发布博客，它的子任务分别是：

• clean:posts: 删除source/_posts下的所有文件
• RawToPosts: 从github拉取更新到raw/my_blog，并拷贝符合条件的文件到source/_posts
• shell:hexoClean: 执行hexo clean
• shell:hexoGenerate: 执行hexo genetate
• zip:dist: 打包public成为blog.zip

通过上述grunt自动化脚本，我保持了博客文件与hexo博客环境相分离的目标，我只需要运行grunt build，grunt会自动帮我拉取最新的博客文件并最终生成hexo目标文件。

这样做的好处是以后不使用hexo时，我可以很方便转移我的博客。

其他

如果是使用github pages来托管博客的同学，可以把grunt build的zip:dist换成自动部署博客的任务，就能一键部署啦。