Add option to declare image styles outside the module.

Ideally, components should be able to declare their own style with no need for it to exist in nuxt.config.js. For example:

<template>
  <div>
    <nuxt-img
      :src="testImage"
      :image-style="imageStyle"
      alt="Never forget alt tags!" />
  </div>
</template>

<script>
export default {
  data () {
    return {
      testImage: '/test.png',
      imageStyle: {
        macros: [
          'scaleAndCrop|160|90',
        ],
      },
    }
  }
}
</script>

This would make components much more reusable across projects.

[Barry-Fisher]

Hi @Capu-zennio

Thanks for your feedback on this.

The original use case was to generically create image styles that can be reused rather than specifically having to define image styles in the consuming code, but I understand your point about portability of the components and possibly the flexibility of being able to specify an image style on-the-fly.

Although this shouldn't be too difficult to implement, it does create more of a surface area for testing. Also, the way processed imaged are stored is in a directory which has the same name as the image style key. I think it would be necessary to not only define the image style on the component itself, but also to specify a key that should be used for storing the images in a maintainable way.

I don't have an time to prioritise this right away due to other commitments, but let's keep this open for now. If I get some time then I can pick this up myself. Otherwise contributions are welcome, subject to there being good test coverage.

Thanks,

Barry