Is it possible to use Vue components in .vue formats vs commonJS formats interchangeably?

Question

This is commonJS format

Vue.Component('custom-component',{
       template : '<p>Some template</p>',
       data : {}
       methods : {}
});

This is .vue format

<template>
    <p>Some template</p>
</template>

<script>
    export default {
        data() {
           return {};
        },
        methods : {}            
    }

</script>
<style>
</style>

My question is, can you have a project with some components written in commonJS format and some components written in .vue format? If so, how do you import one kind of component in the other?

Answer 1

Yes, you can.

.vue files will be packed into common js and common js format will be left as is by webpack.