Question

我正在使用Vue 2.0 + VueRouter并尝试将VueMdl（https://posva.net/vue-mdl/#/usage）组件集成到我的项目中。

该站点作为Spring Boot使用嵌入式Apache Tomcat提供的静态资源运行，因此请考虑前端未在NodeJs环境中运行。

问题是我无法弄清楚为什么VueMdl组件没有正确注册。 require（）函数不起作用，因为它特定于NodeJ和浏览器开发者控制台，如果我键入VueMdl或console.log（VueMdl）...我可以看到该对象被定义为好。

提前谢谢你，

app.js

const router = new VueRouter({
  routes: routes
})

// load main Vue.js app
var app = new Vue({
  el: '#app',
  router: router,
  components: VueMdl.components,
  directives: VueMdl.directives
})

的index.html

<html>
  <head>
    [....]
  </head>
  <body>
    [....]
    <script src="https://unpkg.com/vue/dist/vue.js"></script>
    <script src="https://unpkg.com/vue-router/dist/vue-router.min.js"></script>
    <script src="//rawgit.com/posva/vue-mdl/master/dist/vue-mdl.min.js"></script>
    <script src="app.js"></script>    
    </body>
</html>

错误文字

[Vue warn]: Unknown custom element: <mdl-textfield> - did you register the 
component correctly? For recursive components, make sure to provide the "name" option. 
(found in <Anonymous> - use the "name" option for better debugging messages.)

Answer 1

我认为你需要导入它：

var VueMdl = require('vue-mdl');

VueMdl组件未正确注册

1 个答案: