Vue.js - Single file component - Unknown custom element

Question

I got a simple single-file component called " MobileApps.vue ":

<template>
    <div class="grey-bg about-page">
        <p>{{ greetings }}</p>
    </div>
</template>

<script>
    export default {
        name: 'Home',
        data() {
            return {
                greetings: "Hello"
            }
        }
    };
</script>

And registering it:

const app = new Vue({
el: '#app',
router,
components: {
    Home,
    About,
    Gas,
    Electricity,
    Contacts,
    Electricity_info,
    Gas_info,
    MobileApps
},
data: {
},
created() {
},
destroyed() {

},
mounted() {
    let mySVGsToInject = document.querySelectorAll('img.inject-me');
    SVGInjector(mySVGsToInject);
},
methods: {
}

});

When I'm trying to open the HTML file with <MobileApps> component I'll get an error:

vue.esm.js:628 [Vue warn]: Unknown custom element: - did you register the component correctly? For recursive components, make sure to provide the "name" option.

But even when I provide a name, nothing happens.

Answer 1

Try with cabeb-case format <mobile-apps> like:

 <mobile-apps></mobile-apps>