@scayle/nuxt-image-provider/README.md

An image provider to handle SCAYLE-specific modifiers

# @scayle/nuxt-image-provider

<div align="center">
  <img src="https://cdn-prod.scayle.com/public/media/general/SCAYLE-Commerce-Engine-header.png" />
</div>

<div align="center">
  <h1>@scayle/nuxt-image-provider</h1>
</div>

<div align="center">
  <h4><a href="https://scayle.dev/en/core-documentation/storefront-guide/storefront-application/readme/what-is-storefront">Documentation</a> | <a href="https://www.scayle.com/">Website</a></h4>
</div>

<div align="center">
  A module for SCAYLE image provider.
</div>
<br/>
<div align="center">
  <a href="https://www.npmjs.com/package/@scayle/nuxt-image-provider"><img src="https://img.shields.io/npm/v/@scayle/nuxt-image-provider/latest.svg?style=flat&colorB=007ec6" /></a>
  <a href="https://www.npmjs.com/package/@scayle/nux-image-provider"><img src="https://img.shields.io/npm/dm/@scayle/nuxt-image-provider.svg?style=flat&colorB=007ec6" /></a>
  <a href="https://www.npmjs.com/package/@scayle/nuxt-image-provider"><img src="https://img.shields.io/badge/license-MIT-blue.svg" /></a>
  <a href="https://nuxt.com"><img src="https://img.shields.io/badge/Nuxt-18181B?logo=nuxt.js" /></a>
</div>

## SCAYLE Nuxt image provider

The SCAYLE Nuxt Image Provider is an image provider based on Nuxt's @nuxt/image module, designed to work seamlessly with SCAYLE-specific image modifiers. It enhances image optimization and delivery by integrating directly with SCAYLE’s infrastructure.

## Installation

```bash
# Using pnpm
pnpm add @scayle/nuxt-image-provider

# Using yarn
yarn add @scayle/nuxt-image-provider

# Using npm
npm install @scayle/nuxt-image-provider
```

## Usage

```ts
export default defineNuxtConfig({
  image: {
    providers: {
      scayle: {
        name: 'scayle',
        provider: '@scayle/nuxt-image-provider',
      },
    },
  },
})
```

```vue
import { ScayleImg, ScaylePicture } from '#nuxt-image-provider/components'

<ScayleImg :width="300" brightness="1" should-trim />

<ScaylePicture :sizes="sizes" :width="300" brightness="1" should-trim />
```

## License

Licensed under the [MIT License](https://opensource.org/license/mit/)

## What is SCAYLE?

[SCAYLE](https://scayle.com) is a full-featured e-commerce software solution that comes with flexible APIs.
Within SCAYLE, you can manage all aspects of your shop, such as products, stocks, customers, and transactions.

Learn more about [SCAYLE’s architecture](https://scayle.dev/en/core-documentation/welcome-to-scayle/getting-started) and commerce modules in the Docs.

## Other channels

- [LinkedIn](https://www.linkedin.com/company/scaylecommerce/)
- [Jobs](https://careers.smartrecruiters.com/ABOUTYOUGmbH/scayle)

<!-- Badges -->

[npm-version-src]: https://img.shields.io/npm/v/@scayle/nuxt-image-provider/latest.svg?style=flat&colorA=18181B&colorB=28CF8D
[npm-version-href]: https://npmjs.com/package/@scayle/nuxt-image-provider
[npm-downloads-src]: https://img.shields.io/npm/dm/@scayle/nuxt-image-provider.svg?style=flat&colorA=18181B&colorB=28CF8D
[npm-downloads-href]: https://npmjs.com/package/@scayle/nuxt-image-provider
[license-src]: https://img.shields.io/npm/l/@scayle/nuxt-image-provider.svg?style=flat&colorA=18181B&colorB=28CF8D
[license-href]: https://npmjs.com/package/@scayle/nuxt-image-provider