https://github.com/lukaVarga/skeletonizer

https://github.com/lukaVarga/skeletonizer

Last synced: 3 months ago
JSON representation

• Host: GitHub
• URL: https://github.com/lukaVarga/skeletonizer
• Owner: lukaVarga
• License: mit
• Created: 2023-01-04T20:25:23.000Z (almost 3 years ago)
• Default Branch: main
• Last Pushed: 2025-08-01T23:48:29.000Z (3 months ago)
• Last Synced: 2025-08-02T00:04:06.213Z (3 months ago)
• Language: TypeScript
• Size: 8.63 MB
• Stars: 5
• Watchers: 1
• Forks: 0
• Open Issues: 3
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md
  • License: LICENSE

Awesome Lists containing this project

• fucking-awesome-angular - skeletonizer - A lightweight package that provides a simple way to create skeletonized views for your application. It has adapters for Vue and Angular and is highly customizable and easy to use. (Third Party Components / Loaders)
• trackawesomelist - skeletonizer (⭐4) - A lightweight package that provides a simple way to create skeletonized views for your application. It has adapters for Vue and Angular and is highly customizable and easy to use. (Recently Updated / [Dec 12, 2024](/content/2024/12/12/README.md))
• awesome-angular - skeletonizer - A lightweight package that provides a simple way to create skeletonized views for your application. It has adapters for Vue and Angular and is highly customizable and easy to use. (Third Party Components / Loaders)

README

          
# Skeletonizer

[![codecov](https://codecov.io/github/lukaVarga/skeletonizer/graph/badge.svg?token=4YZYRB9UN7)](https://codecov.io/github/lukaVarga/skeletonizer)

Skeletonizer is a lightweight package that provides a simple way to create skeletonized views for your application. 

It has adapters for Vue and Angular and is highly customizable and easy to use.

With Skeletonizer, you do not need to worry about skeletonized views ever being out of sync with the designs of the components or component parts you wish to skeletonize.

You only need to provide a skeleton config and the package will take care of the rest.

![Vue example](https://github.com/lukaVarga/skeletonizer/blob/main/assets/skeletonizer-example-vue.gif?raw=true)

Example app on Stackblitz for Vue [can be found here](https://stackblitz.com/edit/skeletonizer-vue-example?file=src%2Fviews%2Fdashboard%2FAnalyticsAward.vue)

![Angular example](https://github.com/lukaVarga/skeletonizer/blob/main/assets/skeletonizer-example-angular.gif?raw=true)

Example app on Stackblitz for Angular [can be found here](https://stackblitz.com/edit/vitejs-vite-8vkyr6?file=src%2Fapp%2Fcomponents%2Frevenue-product%2Frevenue-product.component.ts)

## Installation

To install the package, run the following command:

`npm install @skeletonizer/vue @skeletonizer/utils --save` or `npm install @skeletonizer/angular @skeletonizer/utils --save`

## Usage

Refer to the documentation for the specific adapter you are using:

- [Vue](packages/vue/README.md)

- [Angular](packages/angular/README.md)

## Contributing

Run the following commands to get started:

- `npm install`

In the project you wish to work on, run the following command:

- `npm run dev`

Before submitting a pull request, make sure to run the following commands:

- `npm run lint`

- `npm run type-check`

- `npm run coverage`

- `npm run build`

## License

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