在Vue.js中异步加载组件不起作用

我正在尝试将加载

VPopper

组件从标准加载替换为异步加载

标准加载-部件加载并正常工作

import { VPopover } from 'v-tooltip'

export default {
  components: {
    VPopover
  }
}

export default {
  components: {
    VPopover: () => import('v-tooltip')
  },
}

异步加载-未正确加载组件

import { VPopover } from 'v-tooltip'

export default {
  components: {
    VPopover
  }
}

export default {
  components: {
    VPopover: () => import('v-tooltip')
  },
}

由于某些原因，上述组件无法正常工作，并且未正确加载组件。可能是因为它不是默认导出，而是v-tooltip Vue组件中的命名导出

我在后面使用Webpack

如果异步加载自定义组件，那么它将按预期工作。例如，这对我是有效的：

export default {
  components: {
    MyCustomComponent: () => import('@/components/MyCustomComponent.vue')
  }
}

---

就像上面提到的@gugadev一样

---

惰性模块导入与模块导出一起返回一个承诺，以 您的案例是一个包含命名导出的对象。我不知道是什么 所有命名的导出都应该导入，所以什么也不做

我发现这个解决方案很有效

export default {
  components: {
    VPopover: () => import('v-tooltip').then(m => m.VPopover)
  }
}

---

惰性模块导入返回模块导出的承诺，在本例中是包含命名导出的对象。Vue不知道应该导入哪些命名的导出，所以什么也不做。只需将组件导出为默认值。@gugadev-Hmm好的，我理解。它不是我的组件，而是通过

npm

安装的

v-tooltip

包组件，包含在

package.json

中。我还可以做什么，或者我必须用fork包来修复这个问题？只需创建一个包装器，在其中导入库并将其作为默认值导出：

import{SomeName}from'v-tooltip'；导出默认名称。