Webpack 在自定义vue.js组件中导入第三方组件（vue颜色）

我最近开始使用Vue.js，我想创建一个简单的TODO应用程序。但是我需要有机会在输入表单中为我的任务选择一种颜色。因此，我找到了一个第三方库vue颜色，但我不知道如何将其包含在我的应用程序中，并基于网页包模板的下一个结构：

../
  src
    components
      ProjectInput.vue
      ProjectItem.vue
      ProjectList.vue
      ColorPicker.vue
    App.vue
    main.js

ComponentProjectInput具有颜色组件的下一个定义：

<template>
    ...
    <color-picker/>

<script>
  import ColorPicker from './ColorPicker'

  export default {
    components: {
      ColorPicker
    },
  ...

...
从“./ColorPicker”导入ColorPicker
导出默认值{
组成部分：{
采色器
},
...

…以及文档中的一个简单组件ColorPicker.vue：

<template>
  <div class="input-group color-picker-component">
     <chrome-picker></chrome-picker>
  </div>
</template>
<script>
  import { Chrome } from 'vue-color'
  export default {
   name: 'ColorPicker',
   components: {
     'chrome-picker': Chrome
   },
 }
</script>

从“vue颜色”导入{Chrome}
导出默认值{
名称：'颜色选择器'，
组成部分：{
“铬选择器”：铬
},
}

它将在渲染ProjectInput时返回一个错误

 [Vue warn]: Error in data(): "TypeError: Cannot read property 'h' of undefined"
 found in
  ---> <Chrome> at src/components/Chrome.vue
   <ColorPicker> at src/components/ColorPicker.vue
     <ProjectInput> at src/components/ProjectInput.vue
       <ProjectList> at src/components/ProjectList.vue
         <App> at src/App.vue
           <Root>

[Vue warn]：数据（）中的错误：“TypeError:无法读取未定义的属性“h”
发现于
--->位于src/components/Chrome.vue
位于src/components/ColorPicker.vue
在src/components/ProjectInput.vue
位于src/components/ProjectList.vue
在src/App.vue

我尝试了不同的方法。我尝试在main.js中导入vue颜色，并使用类似于vue.use（VueColor）的命令在ProjectInput中创建组件，如var Chrome=VueColor.Crome，但它返回一个错误VueColor未定义

---

如何正确导入？

vue color

组件找不到初始颜色。应提供

v-model

或

：value/@input

：

newvue({
el:“应用程序”，
组成部分：{
ChromeColor:VueColor.Chrome
},
数据：{
颜色：“#ff00ff”
}
})

---

哦，谢谢！是的，你说得对，我错过了v型车。现在它可以正常工作了。