不能使用单个文件组件。 "Registered but never used"

Question

我想将单个文件组件(zoomOnHover(导入到我的Product.vue组件中。当我试图将其包括在我的it打印输出错误中时："；zoomOnHover被分配了一个值但从未被使用"；。

我使用的是vue-cli，这与webpack或vue-loader有关吗？

基本上只是做：

<template>
<zoom-on-hover img-normal="image.jpg"></zoom-on-hover>
</template>
<script>
import zoomOnHover from "../zoomOnHover"
export default {
name: "Product",
components: { zoomOnHover },
</script>

Answer 1

我猜您在../zoomOnHover.js中执行以下操作

import ZoomOnHover from "vue-zoom-on-hover"
Vue.use(ZoomOnHover)

对于以下呼叫：

import zoomOnHover from "../zoomOnHover"

这不起作用，因为它不是导出而是设置一个全局组件。

为什么？：因为文档：https://www.npmjs.com/package/vue-zoom-on-hover

因此，在../zoomOnHover.js中，执行：

import ZoomOnHover from "vue-zoom-on-hover"
export default ZoomOnHover

或者只使用类似的用法：

...
<script>
import zoomOnHover from "vue-zoom-on-hover"
export default {
components: { zoomOnHover },
...
}
</script>