wemake-services/ nuxt-imagemin

JavaScript

Nuxt.js

image-optimization

nuxt-module

nuxtjs

vuejs

View on GitHub

Need help with nuxt-imagemin?

Click the “chat” button below for chat support from the developer who created it, or find similar developers for support.

About the developer

wemake-services

165 Stars

8 Forks

MIT License

237 Commits

6 Opened issues

Description

Nuxt module to minify your images. Works with: png, jpeg, gif, and svg

Services available

Need anything else?

Contributors list

Readme

nuxt-imagemin

Name: nuxt-imagemin
Brand: nuxt-imagemin
SKU: //wemake-services/nuxt-imagemin
Rating: 2.1625 (165 reviews)

Nuxt

module to minify your images. Works with:

png

jpeg

gif

, and

svg

Installation

npm install --save nuxt-imagemin
yarn add nuxt-imagemin

Add

nuxt-imagemin

to your

nuxt.config.js

{
  modules: ["nuxt-imagemin"];
}

Usage

Put your images inside
```
assets
```
folder, for example:
```
logo.png
```
Then create an element to render it:
When you will bundle your app for production,
```
nuxt
```
will minify your image assets

Options

We use

imagemin

plugin for

webpack

internally. It has a lot of options. We pass any provided options into the

imagemin

itself:

{
  modules: [
    [
      "nuxt-imagemin",
      {
        optipng: { optimizationLevel: 5 },
        gifsicle: { optimizationLevel: 2 }
      }
    ]
  ];
}

Custom plugins

If you want to add a custom plugin for

imagemin

, you can follow this steps with

imagemin-webp

as example.

import imageminWebp from 'imagemin-webp'

module.exports = {
  modules: [
    ['nuxt-imagemin', {
      plugins: [
        imageminWebp({quality: 50})
      ]
    }]
  ]
}

License

MIT.