Vue.jsでv-on:clickが動作しません

Question

前提・実現したいこと

docker上でLaravel×Vue.jsで開発をしており、削除ボタンをコンポーネント化しようとしております。

当方、Vue周りの知識が弱いので、最適なデバッグが出来ていない可能性がございます...。
大変恐れ入りますが、ヒント等がございましたらご教示頂きたいです。

発生している問題・エラーメッセージ

v-on:clickが動作しません。
削除ボタン自体は表示されるのと、createdやmountedは動作するので、Vueコンポーネント自体の読み込みは成功していると思っております。
エラーメッセージは特に出ておりません。

該当のソースコード

ソースコードは以下になります。
関係しそうな箇所のみ抜粋しております。

TestComponent.vue

<template>
    <button class="btn btn-danger btn-lg" v-on:click="clickFunc">削除</button>
</template>

<script>
    export default {
//      動作しない
        methods: {
            clickFunc: function(){
                console.log('clicked!')
            }
        },
//      動作する
        created: function() {
            console.log('created!')
        }
    }
</script>

test.blade.php

@section('content')
<div>
    <div class="col-2" id="app">
    <test-component></test-component>
    </div>
</div>
@endsection

@section('addJs')
    <script src="{{ asset('js/app.js') }}"></script>
@endsection

webpack.mix.js

const mix = require('laravel-mix');

mix.js('resources/js/app.js', 'public/js')
   .sass('resources/sass/app.scss', 'public/css')
   .sass('resources/sass/role/role_index.scss', 'public/css');

app.js

/**
 * First we will load all of this project's JavaScript dependencies which
 * includes Vue and other libraries. It is a great starting point when
 * building robust, powerful web applications using Vue and Laravel.
 */

require('./bootstrap');

window.Vue = require('vue');

Vue.component('example-component', require('./components/ExampleComponent.vue').default);
Vue.component('role-show-delete-button-component', require('./components/RoleShowDeleteButtonComponent.vue').default);

const app = new Vue({
    el: '#app',
});

試したこと

・Laravel×Vue.jsで調べると出てくる記事に倣い、jsの読み込み方を変更

<script src="{{ mix('js/app.js') }}"></script>

・ブラウザ側のキャッシュクリア
・Docker再起動
・npm run watchコマンドの停止、再実行

上記以外にも、「v-on not working」などで引っかかった海外の記事もいくつか試しましたが解決できておりません。
ボタン自体の表示やcreatedが動作することから、jsファイルの読み込みの仕方や順番あたりに問題があるのではとあたりをつけておりますが、問題特定ができていない状況です。

補足情報（FW/ツールのバージョンなど）

Vue:2.5.17
vue-template-compiler： 2.6.10
Docker:19.03.8
PHP:7.4.7
Laravel:6.18.40

大変お手数お掛けしますが、宜しくお願い致します。

Answer 1

普通に動きます
<template>
  <button class="btn btn-danger btn-lg" @click="clickFunc">削除</button>
</template>
<script>
export default {
  methods: {
    clickFunc() {
      console.log('clicked!')
    },
  },
}
</script>

//app.jsに足りなものを追加　コードミス
Vue.component(
  'test-component',
  require('./components/TestComponent.vue').default
)