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

nuxt-imagemin

wemake.services Build Status

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

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

Read more about how assets work.

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.

We use cookies. If you continue to browse the site, you agree to the use of cookies. For more information on our use of cookies please see our Privacy Policy.