组件调用错误,路径问题

使用vue-cli构建项目,在项目进行的过程当中,某个详情页调用组件报错,在别的页面中一样调用过该组件,可是没有报错。错误信息以下:vue

This dependency was not found:
* play.vue in ./node_modules/babel-loader/lib!./node_modules/vue-loader/lib/selector.js?type=script&index=0!./src/components/detail/detail.vue
To install it, you can run: npm install --save play.vue

引用组件代码:node

<script>
  import play from 'play.vue';
  import foot_contact from '../home/foot_contact.vue';
  export default {
  name: "detail",
  components: {
    play,
    foot_contact,
  },
  data() {
    return {
      activeIndex: '1',
      activeIndex2: '1'
    }
  },
  methods: {
    handleSelect(key, keyPath) {
      console.log(key, keyPath);
     }
   }
 }
</script>

经查证,是路径问题。由于子组件与父组件在同一个目录下,因此引入子组件时,我直接使用了组件的文件名(play.vue)。这使得vue在编译时,把它当作node_modules下的模块,所以要求你安装。vue-cli

在项目中引用组件是须要写相对路径的,即便是在同一目录下。在个人项目中,须要改正的也就是'./play.vue'。npm

在信息时代,知识的分享使得问题的解决比之前容易不少,只有不断总结与前进,你才能与时俱进。感谢网友们的分享:https://segmentfault.com/q/10...segmentfault

相关文章
相关标签/搜索