hexo next 主题优化

今天我对 Hexo 进行了一些优化,需要进行代码压缩。在网上找了很多的教程,大多数都使用 gulp 这个插件进行代码压缩,但我不建议大家使用。
因为我使用的过程中发现这个可能无法压缩部分 JS。导致出错,原因是较旧的 uglify 不支持 ES6。
所以我个人建议大家使用 hexo-all-minifier

hexo-all-minifier 介绍

hexo-all-minifier 项目地址:在 Github 查看 hexo-all-minifier 项目
引用一下官方说明:

Integrate all the official minifier plugins of HEXO and a imagemin plugin:
译:本插件集成了 Hexo 官方 minifier 插件和 imagemin 插件:

hexo-all-minifier 安装

在 hexo 目录中运行下面的命令

1
npm install hexo-all-minifier --save

在 hexo 配置文件中插入下面的代码

1
all_minifier: true

执行代码刷新,查看效果

1
2
hexo g
hexo d

hexo-all-minifier 配置

其实这个官方有详细的说明,我先贴一下,后面有时间的话进行翻译
:star2::new:!NEW

1
2
3
4
js_concator:
enable: false
bundle_path: '/js/bundle.js'
front: false

  • enable - Enable the Js concator. Defaults to false.
  • bundle_path - The output path of the bundle script. It will be set as absolute path to the root dir.
  • front - Put the bundle script in the front of all scripts in body tag. Default to false, which means the bundle script will be placed in the back of other scripts.

The concator will concat all local scripts into one bundle script and attach it to the end of html’s body tag.
More detail control will be allowed in the future version.


1
2
3
4
html_minifier:
enable: true
ignore_error: false
exclude:
  • enable - Enable the HTML minifier. Defaults to true.
  • ignore_error - Ignore the error occurred on parsing html.
  • exclude - Exclude files. Glob is support.

1
2
3
4
css_minifier:
enable: true
exclude:
- '*.min.css'
  • enable - Enable the CSS minifier. Defaults to true.
  • exclude - Exclude files. Glob is support.

1
2
3
4
5
6
7
js_minifier:
enable: true
mangle: true
output:
compress:
exclude:
- '*.min.js'
  • enable - Enable the JS minifier. Defaults to true.
  • mangle: Mangle file names
  • output: Output options. If it is empty, please remove it from the .yml file! Otherwise it will be set to null, which is different from undefined.
  • compress: Compress options. If it is empty, please remove it from the .yml file! Otherwise it will be set to null, which is different from undefined.
  • exclude: Exclude files. Glob is support.

1
2
3
4
5
6
7
image_minifier:
enable: true
interlaced: false
multipass: false
optimizationLevel: 2
pngquant: false
progressive: false
  • enable - Enable the image minifier. Defaults to true.
  • interlaced - Interlace gif for progressive rendering. Defaults to false.
  • multipass - Optimize svg multiple times until it’s fully optimized. Defaults to false.
  • optimizationLevel - Select an optimization level between 0 and 7. Defaults to 2.
  • pngquant - Enable imagemin-pngquant plugin. Defaults to false.
  • progressive - Lossless conversion to progressive. Defaults to false.
  • exclude - Exclude specific types of image files, the input value could be gif,jpg, png, or svg. Default to null. Glob is not support.
坚持原创技术分享,您的支持将鼓励我继续创作!