Muchas veces al compilar Vue 3 en Laravel nos da la siguiente advertencia en la consola del navegador [Vue warn]: Component provided template option but runtime compilation is not supported in this build of Vue. Configure your bundler to alias “vue” to “vue/dist/vue.esm-bundler.js”.

Para solucionar la advertencia necesitamos configurar el bundler con el alias “vue”, y para ello tenemos dos opciones:

Primera Solución cambiar vue por esm-bundler

La primera solución se trata de cambiar el import de la librería vue por la del esm-bundler. Para ello, en nuestro archivo js reemplazamos:

import { createApp } from 'vue'

Por lo siguiente:

import { createApp } from 'vue/dist/vue.esm-bundler.js'

Volvemos a compilar nuestra aplicación de Vue 3 y listo no debería salirnos más la advertencia de “Component provided template option but runtime compilation is not supported in this build of Vue.”

Segunda Solución: Agregar el Alias en la configuración de nuestro bundler

En el caso de Laravel que empezó a utilizar Vitejs como compilador, necesitamos agregar en el archivo vite.config.js lo siguiente:

export default defineConfig({
	…
      resolve: {
        alias: {
            'vue': 'vue/dist/vue.esm-bundler.js'
        },
    },
});

Nuevamente, volvemos a compilar y tendríamos solucionado el error para Configure your bundler to alias “vue” to “vue/dist/vue.esm-bundler.js”.

Copyright © 2018-2020 Latirus. Todos los Derechos Reservados.