vueコンポーネントがビューに表示されません。。。

前提・実現したいこと

vueのコンポーネントを使ってビューに表示する為の学習をしているのですが、コンポーネントがビューに表示できずに悩んでおります。

以下のコードで実施したい内容としては独自のビューtest.blade.phpで元々laravel に用意されているexample-componentの内容を表示したいです。

複数のサイトで実施方法を調べて試してみているのですが、解決に至っておりません。

発生している問題

以下のコードでnpm run devを実施した後、chromeで/messagesにアクセスしても真っ白なページが表示されてしまい、かつ、エラーメッセージは何も出力されません。

該当のソースコード

routes/web.php

PHP
1Route::GET('/messages', function(){
2  return view('test');
3});

test.blade.php

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link href="{{ asset('css/app.css') }}" rel="stylesheet">
  <meta name="csrf-token" content="{{ csrf_token() }}">
  <title>Document</title>
</head>
<body>
  <div id="app">
    <example-component></example-component>
  </div>
  
  <script src="{{ asset('js/app.js') }}"></script>
</body>
</html>

app.js

require('./bootstrap');
require('./entry_btn');

window.Vue = require('vue');

Vue.component(
    'example-component',
    require('./components/ExampleComponent.vue').default
);

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