Invalid component name: "0". Component names should conform to valid custom element name in html5 specification

Выдает cледующую ошибку когда пытаюсь импортировать компоненты

Invalid component name: "0". Component names should conform to valid custom element name in html5 specification.

Подскажите в чем может быть ошибка?

    <template>
<div class="container">
    <div class="row">
        <div class="col-md-3 bg-dark" style="margin-right:20px;">
            <ul class="navbar-nav">
                <li class="nav-item">
                    <a class="nav-link menu_link text-white" href="">Profile settings</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link menu_link text-white" href="">Profile settings</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link menu_link text-white" href="">Profile settings</a>
                </li>
            </ul>
        </div>
        <div class="col-md-8 bg-dark">
            <ProfileSettings/>
        </div>
    </div>
</div>

    <script>
    import ProfileSettings from './ProfileSettingsComponent';
    export default {
        name: "ProfileComponent",
        components: {
            ProfileSettings
        }
    }
    </script>



   Vue.component('profile-component', require('./components/ProfileComponent').default);