260+ Flag Icons For Vue.js - flagpack

Install & Download:

# NPM
$ npm i vue-flagpack

Description:

Another icons library that enables you to use Flagpack flag icons as components in your Vue.js applications.

How to use it:

1. Import icons.

import Vue from 'vue'
import Flag from 'vue-flagpack'

2. Register the component.

Vue.use(Flag, {
  name: 'Flag'
})
// or
Vue.component('flag-us', {
  components: {
    Flag
  }
})

3. Add a flag icon to the app.

<template>
  <vue-flagpack code="US" />
</template>

4. Config the flag icon with the following props.

size: {
  type: String,
  default: 'm',
  validator: value => (
    ['s', 'm', 'l'].indexOf(value) !== -1
  ),
},
code: {
  type: String,
  default: '528'
},
hasDropShadow: {
  type: Boolean,
  default: false,
},
hasBorder: {
  type: Boolean,
  default: true
},
hasBorderRadius: {
  type: Boolean,
  default: true,
},
gradient: {
  type: String,
  validator: value => (
    ['top-down', 'real-linear', 'real-circular'].indexOf(value) !== -1
  ),
},
className: {
  type: String
}