1.1.16 • Published 5 years ago
@tueri/react-tueri v1.1.16
Tueri for React
React integration for Tueri image processing service.
- Automatic image optimization (compression, resizing and image format)
- Responsive images
- Lazy Loading
- Low-quality image placeholders (LQIP)
Installation
- NPM:
npm install @tueri/react-tueri
- YARN:
yarn add @tueri/react-tueri
Usage
- Add the
<TueriProvider/>
component to the root of your React component tree. This component provides child components api and base url information.
import TueriProvider from '@tueri/react-tueri'
ReactDOM.render(
<TueriProvider>
<MyRootComponent />
</TueriProvider>,
document.getElementById('root)
)
- Use the Tueri
<Img />
component to render your images.
<Img src={ tueriImageId } alt='Alt Text' />
The <Img />
component automatically handles image optimization, responsive images, lazy loading and low-quality image placeholders.
Props
src
: String (REQUIRED)alt
: String (REQUIRED)options
: Object (optional)- Default:
{ w: autoCalculatedWidth }
- Possible values: see documentation for complete option list
- Default:
format
: String (optional)- Default:
'jpg'
- Possible values:
'jpg', 'png', 'webp', 'gif'
- Default:
1.1.16
5 years ago
1.1.15
5 years ago
1.1.14
5 years ago
1.1.13
5 years ago
1.1.12
5 years ago
1.1.11
5 years ago
1.1.10
5 years ago
1.1.9
5 years ago
1.1.8
5 years ago
1.1.7
5 years ago
1.1.6
5 years ago
1.1.5
5 years ago
1.1.4
5 years ago
1.1.3
5 years ago
1.1.2
5 years ago
1.1.1
5 years ago
1.1.0
5 years ago
1.0.10
5 years ago
1.0.9
5 years ago
1.0.8
5 years ago
1.0.7
5 years ago
1.0.6
5 years ago
1.0.5
5 years ago
1.0.4
5 years ago
1.0.3
5 years ago
1.0.2
5 years ago
1.0.1
5 years ago
1.0.0
5 years ago