Component provided template option but runtime compilation is not supported in this build of Vue

[philippeluickx]

I am running into this warning (and no component) on a pretty clean install for vue3 with TS.

[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". 
  at <Anonymous> 
  at <VueFeather type="feather" > 
  at <Login onVnodeUnmounted=fn<onVnodeUnmounted> ref=Ref< 
Proxy { <target>: {…}, <handler>: {…} }
 > > 
  at <RouterView> 
  at <App>

[fengyuanchen]

It is a Vue bundled file problem, please check out Explanation of Different Builds of Vue 3.

---

In short, use:

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

instead of :

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

[adidesember]

thanks, it's work for me

[azzazkhan]

@fengyuanchen Is there a type declaration for this file? Because TS yells at me when I use it.

[fengyuanchen]

@azzazkhan See main npm package files

[adidesember]

It is a Vue bundled file problem, please check out Explanation of Different Builds of Vue 3.

In short, use:

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

instead of :

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

thanks, it works for me

[patanvadiya]

yes it **

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

**'; working

[AsimpleUA]

Just add additional config to vue.config.js:

[zaos22]

@fengyuanchen legend!!

[ARBS23]

Just add additional config to vue.config.js:

Perfect!
Worked for me, Thanks

[Speuce]

For others who also are trying to do this in nx, or using webpack, just set your configure-webpack.js to

module.exports = {
  resolve: {
    alias: {
      'vue$': 'vue/dist/vue.esm-bundler.js',
    },
  },
};

[ianjamieson]

I had the same issue while trying to upgrade from vue2 to vue3, the migration guide suggested I should be using @vue/compat. So in fact my alias should look like this:

resolve: {
    alias: {
        vue: '@vue/compat/dist/vue.esm-bundler',
    }
},

[HannahNguyen6729]

It is a Vue bundled file problem, please check out Explanation of Different Builds of Vue 3.

In short, use:

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

instead of :

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

thanks a lot, it works for me

[yinkeli]

I have tried many configuration methods to modify vite.config.js,

resolve: { alias: { vue: "vue/dist/vue.esm-bundler.js" } },

runtimeCompiler: true,

but there is no effect, still an error
**runtime-dom.esm-bundler-c98336b7.js:1598 [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". **

[Stepykun]

@yinkeli same for me. Did you find any solution?