Don't work (Meteor + Element UI)

[thearabbit]

I base on Meteor + Element UI. get error

printer.js:170 [Vue warn]: You are using the runtime-only build of Vue where the template compiler is not available. Either pre-compile the templates into render functions, or use the compiler-included build. 
(found in <Breadcrumbs>)

[samturrell]

Hi @thearabbit - Would you be able to provide an example repository with the error?

[andycaramba]

Hi. I have this error too.

If install vue with npm and without <script src="https://cdn.jsdelivr.net/vue/2.3.0/vue.js"></script> in index.html Then use it this manner

import Vue from 'vue';
import VueRouter from 'vue-router';
import VueBreadcrumbs from 'vue-breadcrumbs';

Vue.use(VueRouter);
Vue.use(VueBreadcrumbs, {
  template: `<nav class="breadcrumb" v-if="$breadcrumbs.length">
    <router-link class="breadcrumb-item" v-for="(crumb, key) in $breadcrumbs" :to="linkProp(crumb)" :key="key">'
      {{ crumb | crumbText }}
    </router-link>
  </nav>`,
});
...
...
...etc

Following error will be occurred

[Vue warn]: You are using the runtime-only build of Vue where the template compiler is not available. Either pre-compile the templates into render functions, or use the compiler-included build.

found in

---> <Breadcrumbs>
          ...other router components

and no breadcrumbs will be rendered

[andycaramba]

The following code in webpack config solves this problem for me

resolve: {
  alias: {
    vue$: 'vue/dist/vue.esm.js',
  },
},

from Vue.js Forum and Vue Explanation of Build Files

[samturrell]

Thanks @andycaramba!

[thearabbit]

@andycaramba, where you put this resolve: {...........?

[andycaramba]

Hi @thearabbit I use webpack as build tool in my project and I put above strings to my webpack config. See here for docs and here for example (I just add vue$: 'vue/dist/vue.esm.js', to this block)

P.S. I don't know how to use it with Meteor. See Meteor docs or try to ask StackOverflow.

[thearabbit]

Thanks again.