https://github.com/twicpics/components

A Web component library that brings the power of TwicPics to your favorite web framework.
https://github.com/twicpics/components

angular components image-processing nextjs nuxtjs reactjs responsive-images sveltejs twicpics vuejs

Last synced: 9 days ago
JSON representation

A Web component library that brings the power of TwicPics to your favorite web framework.

• Host: GitHub
• URL: https://github.com/twicpics/components
• Owner: TwicPics
• License: mit
• Created: 2021-07-27T04:17:42.000Z (over 3 years ago)
• Default Branch: main
• Last Pushed: 2024-10-18T12:04:47.000Z (21 days ago)
• Last Synced: 2024-10-20T03:50:19.259Z (19 days ago)
• Topics: angular, components, image-processing, nextjs, nuxtjs, reactjs, responsive-images, sveltejs, twicpics, vuejs
• Language: TypeScript
• Homepage:
• Size: 4.6 MB
• Stars: 53
• Watchers: 4
• Forks: 2
• Open Issues: 6
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md
  • License: LICENSE

Awesome Lists containing this project

README

        


# TwicPics Components

TwicPics components is a library of components to provide context-aware optimization for images and videos. They come with best practices out of the box: lazy loading, Low Quality Image Placeholders, optimized Cumulative Layout Shift (CLS), and more.

## Get Started

This project is available as an NPM package: [`@twicpics/components`](https://www.npmjs.com/package/@twicpics/components).

Installation:

```sh

# with yarn

yarn add @twicpics/components

# or with NPM

npm install @twicpics/components

```

[Read the documentation](./documentation).

## Contributing

This project uses yarn as dependency manager.

### Building 

Simply type `yarn build`. Dependencies are installed automatically.

### Testing

To run tests, use the following commands:

```sh

# testing common code accross all frameworks

yarn test:common

# testing ui

yarn test:ui

# testing ui for specific frameworks

yarn test:ui react svelte          # only test UI for react and svelte3, svelte4, svelte5 and sveltekit

yarn test:ui ^vue                  # test UI for all frameworks except vue2 and vue3

```