Переход с vue2 на vue3

Всем привет. Работал с vue2 через cdn.

Есть 2 компонента и просто файл index.html

cars.js
motorcycles.js
index.html

cars.js содержит:

const cars={
     
    template:"<div>Тут машины</div>",
};
const app=Vue.createApp();
app.component('cars', cars));  
app.mount('#my');

index.html содержит:

<script type="module" src="cars.js"></script>

<div id="my"><cars></cars></div>

На данном этапе всё хорошо. Отображается "Тут машины".

Теперь мне нужно импортировать второй компонент в первый и там его использовать. Вот что я делаю.

Редактирую cars.js:

const cars={
     
    template:"<div>Тут машины</div><motorcycles></motorcycles>",
};
const app=Vue.createApp();
app.component('cars', cars));  
app.component('motorcycles', () => import('/motorcycles.js')); 
app.mount('#my');

Не работает. Моя проблема в том, что незнаю как правильно импортировать второй компонент. Или как объявить о втором компоненте.

Сейчас там так:

motorcycles.js содержит:
const motorcycles={
     
    template:"<div>Тут Мотоциклы</div>",
}; 
app.component('motorcycles', motorcycles));   

Была идея сделать export default motorcycles; Но не помогло. Так же не помогло и createApp если прописать в компоненте motorcycles.js. Во второй версии Vue я бы сделал так: Vue.component('motorcycles', motorcycles)); и всё. И это работало бы. А как сделать на Vue3 это правильно?