Owen-Tsai / salmon-icons

A tree-shakeable Vue 3 icon library built for Salmon UI.

Salmon Icons

A tree-shakable icons library built for Salmon UI.

Link to the complete list of icons

salmon-icons requires Vue 3

NOTICE Since version 1.0.5-beta2
salmon-icons is now a scoped package under @salmon-ui. Please use @salmon-ui/icons instead.

Install

npm install @salmon-ui/icons

OR

yarn add @salmon-ui/icons

Usage

Local registration:

<template>
  <heart-fill />
  <close class="custom-class" />
</template>

<script lang="ts" setup>
import {
  HeartFill,
  Close
} from '@salmon-ui/icons'
</script>

Alternatively, you can import all icons and register them all via a loop.

Note that the icon name might be reserved in HTML, or has the same name as one of your component, or your code of conduct prohibits the usage of single-word custom tags. When dealing with such circumstances, remember to specify an alias.

import {
  At as IconAt,
  UserFill
} from '@salmon-ui/icons'

Development

Put all your source icons (*.svg) into the icons directory, then run:

npm run generate:sfc

to generate vue components in packages directory.

Run

npm run build

to build the library. Bundled files will be written into dist folder.

Other Scripts

Build library without type declarations:

npm run build:sfc

Generate type declarations only:

npm run build:types