Giter Site home page Giter Site logo

hexo-img-optimization's Introduction

Hexo-img-optimization

A simple image optimization library for hexo. It works with imagemagick therefore you'll need it to run this.
For Mac OS X, it's as simple as running:
brew install imagemagick

Info for other systems can be found here: ImageMagick.

Usage

To install:
npm i --save hexo-img-optimization

After the installation is complete, simply: hexo generate && hexo img

Hexo img will run through your public directory, find all .jpg/.jpeg/.png files and proccess them with imagemagick. It can also optionally make thumbnails if you provide that option in config.yml The exact image modifications can be changed via _config.yml:

img_optimization: # root of configuration for image optimization
  exclude: # exclude takes an array of file names or directories to ignore from the public folder. Defaults to no exclusions.
    - css/ # anything that ends with a forward slash will be considered a directory
    - fancybox/
    - banner.jpg # anything else is a file
  jpg:
    enabled: true # if false, jpgs will get ignored. Defaults to true
    params: -resize 760000@ # parameter string to pass to imagemagick's convert function
  png: # jpg/png/jpeg all have the same fields and can be configured independently
    enabled: false
    thumb: -resize 680x680> -strip -quality 82 -alpha Remove
  jpeg:
    enabled: false
  # these parameters will be used for any file types that do not have a params parameter defined in config. You can override these to your own preferred defaults.
  default_params: -resize 760000@ -filter Triangle -define filter:support=2 -unsharp 0.25x0.25+8+0.065 -dither None -posterize 136 -quality 85 -define jpeg:fancy-upsampling=off -interlace none -colorspace sRGB -strip -define png:compression-filter=5 -define png:compression-level=9 -define png:compression-strategy=1 -define png:exclude-chunk=all
  default_thumb: -resize 680x680> -sampling-factor 4:2:0 -strip -quality 85 -interlace JPEG -colorspace RGB 

Under no means is the default parameter setup optimal. Please experiment and find what works for you.

Take note that under default configuration hexo-img-optimization will touch all your images and change them, therefore a good starting point for hexo would be the following:

img_optimization:
  exclude:
    - css/
    - fancybox/

The idea was born when hosting hexo in s3, where I'd like to deploy modified images in order to speed up the blog loading speed.

hexo-img-optimization's People

Contributors

vkuznecovas avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar

Forkers

sts0mrg0

hexo-img-optimization's Issues

Command failed: convert: no decode delegate for this image format `JPG'

OS: ubuntu18.04
built and installed imagemagick from source.
run test summary like this

============================================================================
Testsuite summary for ImageMagick 7.0.8
============================================================================
# TOTAL: 86
# PASS:  84
# SKIP:  0
# XFAIL: 0
# FAIL:  2
# XPASS: 0
# ERROR: 0
============================================================================

when running hexo img

...some more file...
INFO  [IMG] Completed processing: public/p/use-python-to-write-a-crawler-crawl-jingdong-commodity-reviews-analyze-emotional-sentiment-and-draw-word-cloud/默认好评.png
INFO  [IMG] Completed processing: public/p/observation-of-a-practical-network-the-software-engineering-course-northwest-university/browser.png
INFO  [IMG] Completed processing: public/p/observation-of-a-practical-network-the-software-engineering-course-northwest-university/cover.jpg
...some more files...

suddenly got a error like this

ERROR [IMG] Proccessing failed for public/p/northwest-university-software-engineering-uml-unified-modeling-language-final-exam-review-materials/cover-uml.jpg
/home/harntu/hexo-tellyouwhat/node_modules/hexo-img-optimization/index.js:52
        throw err
        ^

Error: Command failed: convert: no decode delegate for this image format `JPG' @ error/constitute.c/ReadImage/556.
convert: no images defined `public/p/northwest-university-software-engineering-uml-unified-modeling-language-final-exam-review-materials/cover-uml.jpg' @ error/convert.c/ConvertImageCommand/3300.

    at ChildProcess.<anonymous> (/home/harntu/hexo-tellyouwhat/node_modules/[email protected]@imagemagick/imagemagick.js:88:15)
    at ChildProcess.emit (events.js:182:13)
    at maybeClose (internal/child_process.js:962:16)
    at Socket.stream.socket.on (internal/child_process.js:381:11)
    at Socket.emit (events.js:182:13)
    at Pipe._handle.close (net.js:610:12)

what should I do? @vkuznecovas

It does not work on windows

PS C:\Users\harbo\Documents\tellyouwhat.cn> hexo img
INFO  [IMG] Doing image magic...
ERROR [IMG] Proccessing failed for public/favicon.png
C:\Users\harbo\Documents\tellyouwhat.cn\node_modules\hexo-img-optimization\index.js:52
        throw err
        ^

Error: Command failed: ÎÞЧ²ÎÊý - /favicon.png

    at ChildProcess.<anonymous> (C:\Users\harbo\Documents\tellyouwhat.cn\node_modules\[email protected]@imagemagick\imagemagick.js:88:15)
    at emitTwo (events.js:126:13)
    at ChildProcess.emit (events.js:214:7)
    at maybeClose (internal/child_process.js:925:16)
    at Process.ChildProcess._handle.onexit (internal/child_process.js:209:5)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.