https://github.com/elelad/ionicons-cleaner

Remove unused Ionicons from the Angular build bundle.
https://github.com/elelad/ionicons-cleaner

angular ionic ionic5 ionicons

Last synced: 26 days ago
JSON representation

Remove unused Ionicons from the Angular build bundle.

• Host: GitHub
• URL: https://github.com/elelad/ionicons-cleaner
• Owner: elelad
• License: mit
• Created: 2021-09-21T18:25:40.000Z (over 3 years ago)
• Default Branch: main
• Last Pushed: 2021-10-08T18:07:23.000Z (about 3 years ago)
• Last Synced: 2024-11-15T22:11:52.475Z (about 1 month ago)
• Topics: angular, ionic, ionic5, ionicons
• Language: TypeScript
• Homepage:
• Size: 42 KB
• Stars: 0
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Ionicons Cleaner

Remove unused Ionicons from your Angular output.

When using ionicons with Angular you have 2 issues:

- On every build you get all the icons in the output folder. This is affecting the bundle size.

- If you want to use Angular PWA and prefetch the icons you get the list of all icons even if you only using few of them.

This repo uses npx to remove all unused icons from the output folder and from the ngsw.json file.

> **_NOTE:_**  This package is still under beta testing - use it carefully.

## Installation

Run `npm install -g ionicons-cleaner`

## How to use

- Run `npx ionicons-cleaner` to remove all unused icons from the output folder.

- Run `npx ionicons-cleaner --clean-ngsw` to remove all unused icons from the output folder and from ngsw.json.

## Dynamic icons

If you set icons dynamically, for example getting them from the server, you need then to be in your build but we don't have a way to know about them during the build.

If you have any of those you may get a warning while trying to use this package. Now you have 2 options:

1. If you sure the warming is false and you don't have icons that sets dynamically in your code you can use the force-delete option: 

`npx ionicons-cleaner --force-delete`

2. To overcome this you can use the whitelist option to list an icons that won't be deleted even if they didn't found in the code.

For example: `npx ionicons-cleaner --whitelist= add close moon --force-delete`

## Options

| Option| Description |

|:---|:---|

| `--output-path`     | By default the output path (destination of the build files) is `www`. If you want to run the script on a different folder you can pass the path to this option. |

| `--svg-dir`     | By default the svg folder is inside the output folder and called `svg`. If you store your svg files in a different folder you can change the name using this option. |

| `--force-delete`     | Delete icons even if you get the dynamic warning. Use this if you provide whitelist or if you sure the dynamic warning is false and you don't have icons that sets dynamically in your code.  |

| `--whitelist`     | List of icons that won't be deleted even if they not found in the code. |

| `--clean-ngsw`     | If you are using Angular service worker set this to true to delete the unused icons from ngsw.json |

| `--sw-svg`     | The name of the svg asset group in the ngsw.json file. Default is `svg`. |

| `--dry-run`     | Use this to see how much icons we can delete without actually deleting them. |

## Tested on:

- Angular 12

- Ionicons 5