为什么我尝试在 VueJS 中加载组件时出现此错误?

Why do I get this error when I try to load the component in VueJS?

我必须尝试尝试,但解决方案仍然是一样的,我是否遗漏了任何步骤?

<template>
<div>
      <component v-bind:is="components"></component>

  </div>
</template>
<script>
import invbo from './components/inventory.vue';
import itemsrbo from './components/itemsearch.vue';
import mainbo from './components/mainbo.vue';
export default {
  components:{
    'inventory':invbo,
    'item-search':itemsrbo,
    'mainbo':mainbo,

  },
  data(){
    return{
      components: 'mainbo'
    }
  }
}
</script>

错误信息

./src/views/Home.vue?vue&type=script&lang=js& (./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/babel-loader/lib!./node_modules/vue-cli-plugin-quasar/lib/loader.auto-import.js?kebab!./node_modules/cache-loader/dist/cjs.js??ref--0-1!./node_modules/vue-loader/lib??vue-loader-options!./src/views/Home.vue?vue&type=script&lang=js&)
Module not found: Error: Can't resolve './components/inventory.vue' in 'C:\Users\...\src\views'

这里是我尝试从组件目录加载 vue 组件的示例代码。

Post库存组件?

在inventory.vue

您应该将组件导出为:

export default {}

所以你需要使用正确的相对路径,然后:import invbo from '../components/inventory.vue @MartinBean 的回答