https://github.com/diegopamio/vue-cloudinary
A Vue.js (https://github.com/vuejs/vue) plugin that offers a reusable directive to get image from Cloudinary (https://cloudinary.com)
https://github.com/diegopamio/vue-cloudinary
Last synced: about 1 month ago
JSON representation
A Vue.js (https://github.com/vuejs/vue) plugin that offers a reusable directive to get image from Cloudinary (https://cloudinary.com)
- Host: GitHub
- URL: https://github.com/diegopamio/vue-cloudinary
- Owner: diegopamio
- License: mit
- Created: 2017-08-26T03:04:29.000Z (over 8 years ago)
- Default Branch: master
- Last Pushed: 2018-10-29T12:50:25.000Z (about 7 years ago)
- Last Synced: 2025-09-13T00:44:45.219Z (3 months ago)
- Language: JavaScript
- Homepage:
- Size: 11.7 KB
- Stars: 25
- Watchers: 1
- Forks: 4
- Open Issues: 5
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
- awesome-vue - vue-cloudinary - A Vue.js (https://github.com/vuejs/vue) plugin that offers a reusable directive to get image from Cloudinary (https://cloudinary.com) ` 📝 3 years ago` (UI Components [🔝](#readme))
- awesome-vue-zh - vue-cloudinary - 一个vue (2.0) 插件,提供可重用的指令以从Cloudinary获取图像 (<https://cloudinary.com>) 具有动态操作 (调整大小/裁剪/效果/水印/缩放/格式化) 和优化 (webp / png /自动质量/自动视网膜) . (UI组件 / 形成)
- awesome-vue - vue-cloudinary - A vue (2.0) plugin that offers a reusable directive to get images from Cloudinary (https://cloudinary.com) with dynamic manipulation (resizing/cropping/effects/watermarking/scaling/formatting) and optimization (webp/png/auto quality/auto retina). (Components & Libraries / UI Components)
- awesome-vue - vue-cloudinary ★15 - A vue (2.0) plugin that offers a reusable directive to get images from Cloudinary (<https://cloudinary.com>) with dynamic manipulation (resizing/cropping/effects/watermarking/scaling/formatting) and optimization (webp/png/auto quality/auto retina). (UI Components / Form)
- awesome-vue - vue-cloudinary - A vue (2.0) plugin that offers a reusable directive to get images from Cloudinary (https://cloudinary.com) with dynamic manipulation (resizing/cropping/effects/watermarking/scaling/formatting) and optimization (webp/png/auto quality/auto retina). (UI Components / Form)
README
# vue-cloudinary
> A [Vue.js](https://github.com/vuejs/vue) plugin that offers a reusable directive to get image from [cloudinary](https://cloudinary.com)
[](https://www.npmjs.com/package/vue-cloudinary)
## Overview
This is a port of the angular-cloudinary library to VueJS.
## Use cases
- Show image from cloudinary
## Requirements
- vue: ^2.0.0
If you need a version for Vue 1, sorry, you'll need to do your own.
## Install
From npm:
``` sh
$ npm install vue-cloudinary --save
```
## Usage
app.js:
``` javascript
Vue.use(VueCloudinary, {
"cloud_name": "",
"api_key": "",
"cdn_subdomain": true,
... (*)
});
```
(*) See [cloudinary documentation](https://cloudinary.com/documentation/solution_overview#configuration_parameters) for a complete list of the options available.
index.html
```html
![]()
```
Further image manipulation options are listed in [this reference](http://cloudinary.com/documentation/image_transformations#reference).
Note that the attribute names in the docs are using snake_case, however this SDK supports both snake_case and kebab-case for attribute names, e.g. both fetch_format: 'auto' and 'fetch-format': 'auto' are eventually translated to f_auto.
## License
[MIT](https://opensource.org/licenses/MIT)