vuetify.js で自作アイコンが表示されない

Question

vuetifyの<v-icon>でsvg形式の自作のアイコンをページ上に表示させたいのですが、表示できません。
何が原因かご教示願えませんでしょうか。

前提・実現したいこと

環境はvue + veutifyです。
svg形式のアイコンを<v-icon>で表示させようとしています。
自作アイコンの表示方法については、以下のページを参考にしました。
https://qiita.com/reud/items/d47c4de86f591b59df09
出力されているHTMLには、自作アイコンで使用するcssの内容が読み込まれているため、cssの配置場所は合っていると思います。

該当のソースコード

<template>
  <section class="container">
    <v-app>
      <v-icon >my-icon1</v-icon>
      <v-icon >my-icon2</v-icon>
    </v-app>
  </section>
</template>

<script>
import '@/assets/myicon/style.css'

export default {
  icons: {
      iconfont: 'my',
  },
  data:function(){
    return {}
  },
};
</script>

myiconフォルダ
|- style.css
|- selection.json
|- demo.html
|- fonts
    |-my.eot
    |-my.svg
    |-my.ttf
    |-my.woff

試したこと

wabfont生成時の設定を変更してみましたが、現象は解消しませんでした。
生成サイト
https://icomoon.io/app/#/select/font
変更内容
[preferences]-[css selector]の設定3パターンとも実施

Answer 1

書き出し時のClass Prefixの設定はどのようになっているでしょうか？
もし以下のスクリーンショットのように icon- が設定されてる場合、

      <v-icon >icon-my-icon1</v-icon>
      <v-icon >icon-my-icon2</v-icon>

のように指定すると正しく表示されるかと思います。