Question

我在我的vue项目中使用http://vuematerial.io/#/getting-started（webpack，热重载，babel等）。

我已经导入了这个库（通过npm）并将其包含在main.js文件中，但我没有看到我的项目有任何变化。浏览器无法呈现它。

我做错了什么？

main.js：

import Vue from 'vue'
import VueMaterial from 'vue-material'
import 'vue-material/dist/vue-material'
import App from './App.vue'

Vue.use(VueMaterial)

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

/* eslint-disable no-new */
new Vue({
  el: 'body'
  components: { App },
  render: h => h(App)
})

App.vue：

<template>
  <div id="app">
    <hello></hello>
    <md-button>Default</md-button> // this doesnt work!
  </div>
</template>

<script>

export default {
  components: {
    'hello': Hello,
    'documents': Documents,
    'Home': Home
  },
  data: function () {
    return {

    }
  }
}
</script>

Answer 1

您是否尝试在节点中终止作业并再次提供服务？我自己并没有使用过vue-material，但是当我涉足vue时，我发现这个问题出现了几次。

Answer 2

您的vue-material.css是否正确导入？

尝试将import 'vue-material/dist/vue-material'更改为import 'vue-material/dist/vue-material.css'

我无法从您的问题中判断出这是您的问题，还是您遇到热重装问题。可能会尝试描述您在浏览器中看到的内容。

Vue材料 - 我没有看到变化

2 个答案: