1

quiero usar vue-material al momento de colocar etiquetas como mg-avatar etc funciona en el componente App.vue y luego cuando creo un componente llamado Home.vue y quiero colocar otras etiquetas como md imput o culquier otra me tira un error de que el template funciona para una ruta que es la de app.vue y no me deja colocar nada en otros componentes

Mi main.js

import Vue from 'vue'
import VueRouter from 'vue-router'
import App from './App.vue'
import Home from './components/Home.vue'
import VueMaterial from 'vue-material'

Vue.use(VueRouter);
Vue.use(VueMaterial);
Vue.component('home',Home);

const routes = [
{
path:'/',
component: Home
},
{
 path:'/home',
component: Home
}
];
const router = new VueRouter({
 routes,
mode: 'history'
});



new Vue({
el: '#app',
router,
render: h => h(App)
});

Vue.material.registerTheme('default', {
primary: 'blue',
accent: 'red',
warn: 'red',
background: 'grey'
})

mi App.vue

<template>
  <div id="app">
  <md-toolbar>
    <h1 class="md-title" style="flex: 1">MichiGuau</h1>
     <md-avatar class='md-large'>
     <img src="./assets/logo.png" alt="Avatar">
    </md-avatar>
     <md-button class="md-icon-button">
      <md-icon>more_vert</md-icon>
    </md-button>
  </md-toolbar>
  <router-view></router-view>
</div>
</template>

<script>
export default {
  name: 'app',
  data () {
    return {
    }
  }
 }
</script>

mi Home.vue // es mi componente nuevo al cuel no le funcionan las etiquetas de vue-material

<template>
 <h1 class="md-title" style="flex: 1">{{title}}</h1>
</template>
<script>
export default {
    name: 'home',
    data(){
        return{
            title: 'Bienvenido a MichiGuau'
        }
    }
  }
</script>
3
  • ¿Podrías citar textualmente el error que tienes?
    – gugadev
    Commented el 2 jul. 2017 a las 20:25
  • ya lo edite espero a verme expresado un poco mejor Commented el 2 jul. 2017 a las 20:42
  • si te agrada material puedes echarle un vistazo a Vuetify es un plugin muy bien elaborado y documentado para VueJs. vuetifyjs.com/es-MX Commented el 12 jul. 2019 a las 15:35

1 respuesta 1

1

Ya resolví mi problema. Por alguna razón el vue-material no deja usar en todas las rutas en el webpack-simple. Así que cree de nuevo un proyecto con:

npm init webpack nombre_de_proyecto

y con eso ya funciona bien.

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.