Necesito renderizar un componente dentro de otro. Pero luego ejecutar el subcomponente no se aplica.

Todo es mundial:

Índice

 <script src=" <?= Helpers::asset('assets/js/vue/componenteA.js'); ?>"></script> <script src=" <?= Helpers::asset('assets/js/vue/componenteB.js'); ?>"></script> <script src="https://cdn.jsdelivr.net/npm/vue"></script>

Aplicación.js

 var app = new Vue({ el: '#app-welcome', components: { 'componenteA': componenteA, 'componenteb' : componenteb }...

componenteA

 const componenteA = { template: "<div><p>xxx</p> <div v-for="d in DEMO"> <componenteB :x="d"></componenteB> </div> ......</div>", props: { x: { type: Object } } data(){}

Cuando ejecuto el código, todo lo que está dentro del componente A se representa en la pantalla; sin embargo, el contenido del componente B no se muestra.

Si ordeno que se muestre el componente B fuera del componente A, se muestra con éxito.

Mi pregunta es cómo hacer que la representación del componente B suceda dentro del componente A.

Informa que el servidor no cuenta con NODE, NPM, VUECLI.

Gracias.