https://github.com/muhammad-fiaz/image-optimize-cli

image-optimize-cli is a powerful library designed to dynamically optimize images based on the user's internet speed and quality settings. It provides components for React, Vue, and Angular frameworks, as well as a utility for static HTML. The library leverages advanced image processing to deliver optimized images efficiently and effectively.
https://github.com/muhammad-fiaz/image-optimize-cli

bun image-optimize image-optimize-cli npm npm-module npm-package npm-packages npmjs optimize-image package

Last synced: 3 months ago
JSON representation

image-optimize-cli is a powerful library designed to dynamically optimize images based on the user's internet speed and quality settings. It provides components for React, Vue, and Angular frameworks, as well as a utility for static HTML. The library leverages advanced image processing to deliver optimized images efficiently and effectively.

• Host: GitHub
• URL: https://github.com/muhammad-fiaz/image-optimize-cli
• Owner: muhammad-fiaz
• License: mit
• Created: 2024-07-23T12:14:28.000Z (5 months ago)
• Default Branch: main
• Last Pushed: 2024-09-18T14:11:34.000Z (3 months ago)
• Last Synced: 2024-10-01T03:42:29.612Z (3 months ago)
• Topics: bun, image-optimize, image-optimize-cli, npm, npm-module, npm-package, npm-packages, npmjs, optimize-image, package
• Language: TypeScript
• Homepage: https://www.npmjs.com/package/image-optimize-cli
• Size: 87.9 KB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • Contributing: CONTRIBUTING.md
  • License: LICENSE
  • Code of conduct: CODE_OF_CONDUCT.md

Awesome Lists containing this project

README

        


# `image-optimize-cli`

[![Contributors](https://img.shields.io/github/contributors/muhammad-fiaz/image-optimize-cli.svg)](https://github.com/muhammad-fiaz/image-optimize-cli/graphs/contributors)

[![Last Commit](https://img.shields.io/github/last-commit/muhammad-fiaz/image-optimize-cli/main.svg)](https://github.com/muhammad-fiaz/image-optimize-cli/commits/main)

[![npm version](https://badge.fury.io/js/image-optimize-cli.svg)](https://badge.fury.io/js/image-optimize-cli)

[![GitHub issues](https://img.shields.io/github/issues/muhammad-fiaz/image-optimize-cli.svg)](https://github.com/muhammad-fiaz/image-optimize-cli/issues)

[![GitHub pull requests](https://img.shields.io/github/issues-pr/muhammad-fiaz/image-optimize-cli)](https://github.com/muhammad-fiaz/image-optimize-cli/pulls)

[![GitHub forks](https://img.shields.io/github/forks/muhammad-fiaz/image-optimize-cli.svg)](https://github.com/muhammad-fiaz/image-optimize-cli/network)

[![GitHub stars](https://img.shields.io/github/stars/muhammad-fiaz/image-optimize-cli.svg)](https://github.com/muhammad-fiaz/image-optimize-cli/stargazers)

[![GitHub followers](https://img.shields.io/github/followers/muhammad-fiaz?label=Follow)](https://github.com/muhammad-fiaz?tab=followers)

[![Sponsor on GitHub](https://img.shields.io/badge/Sponsor%20on%20GitHub-Become%20a%20Sponsor-blue)](https://github.com/sponsors/muhammad-fiaz)



 Join our Discord Community: 


[![Join Our Discord](https://img.shields.io/badge/Discord-Join_us!-blue?style=flat&logo=discord)](https://discord.com/invite/pMw7nfBzXz)








`image-optimize-cli` is a library that dynamically optimizes images based on user internet speed and quality settings. It provides components for React, Vue, and Angular, and also supports plain JavaScript usage.


## Installation

To install `image-optimize-cli`, run:

```bash

npm install image-optimize-cli

```

## Usage

### React

To use `image-optimize-cli` with React, import the `OptimizeImage` component and use it in your components:

```jsx

import React from 'react';

import { OptimizeImage } from 'image-optimize-cli/react';

  

function App() {

  return (

    


      

    

  );

}

```


### Vue

To use `image-optimize-cli` with Vue, import the `OptimizeImage` component and use it in your components:

```vue

  


    

  


import { OptimizeImage } from 'image-optimize-cli/vue';

export default {

  components: {

    OptimizeImage,

  },

};

```

### Angular

To use `image-optimize-cli` with Angular, import the `OptimizeImage` component and use it in your components:

```typescript

import { Component } from '@angular/core';

import { OptimizeImage } from 'image-optimize-cli/angular';

@Component({

  selector: 'app-root',

    template: `

        


        

        

    `,

})

export class AppComponent {}

```


### JavaScript

To use `image-optimize-cli` with plain JavaScript, import the `OptimizeImage` class and use it in your scripts:

```javascript

import { OptimizeImage } from 'image-optimize-cli';

const OptimizeImage = new OptimizeImage('image.jpg', 'Image');

document.body.appendChild(OptimizeImage);

```

## Contributing

We welcome contributions to the project! Please follow the guidelines in [CONTRIBUTING.md](CONTRIBUTING.md) for submitting issues and pull requests.

## License

This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.

include.