[Vue.js] htmlタグと重複するコンポーネント名の命名規則をどうするか #Vue.js

Vue.jsでコンポーネントを作成するときにHeader.vueなどhtmlタグとかぶってしまうコンポーネント名をつけたいときにどうすれば良いのか困ったので調べてみました。

調べた限りだと以下の3つのパターンが存在します。

Vue.jsの公式でも紹介されているvue-hackernews-2.0をみて見ると、headerなどのhtmlと被りそうなコンポーネントは存在しません。

個人プロジェクトや小規模の案件だと問題なさそうですが、ヘッダーやフッターをコンポーネントに切り出したい場合もあると思うのでちょっと微妙です。

App や AppName のようにprefixをつければhtmlタグとの名称の衝突を回避できます。

ただ、すべてのコンポーネントにprefixをつけるのもめんどくさく、htmlタグと重複するものだけにprefixをつけるのも微妙ですね・・・

Header.vue を作成して、コンポーネントを読み込むときに v-header などとします。
App.vueを以下のようにするイメージです。

<script>
import Header from '@/components/Header'
export default {
  name: 'app',
  components: {
    'v-header': Header
  }
}
</script>

AppNameHeader.vueのようにprefixをつける

と発想は同じですが、こちらの方がコンポーネント名もすっきりするので今のところこの方法が1番良いかなと思っています。（ v- とするとVue.jsの機能かな？と読み手が感じるケースがあるかもしれません）

この3つ以外の方法があったり、これがベストプラクティスだ！という方法があれば教えて欲しいです。