Vue.js Vue:在组件中添加组件引用后未知的自定义元素

我是Vue新手，正在测试Vue可拖动组件。添加对vue可拖动组件的引用后，出现错误“未知自定义元素：-是否正确注册了组件？对于递归组件，请确保提供“名称”选项。”

我错过了什么？以前的类似线程在组件中没有引用组件

import draggable from "./vue-draggable";

Vue.component('fxm-form', {
    name: 'fxm-form',

    props: [
        "formMode"
    ],

    components: {
        draggable
    },

    data() {
        return {
            list: ['AAA', 'BBB', 'CCC', 'DDD', 'EEE', 'FFF']
            }
    },


    mounted() {
    },

    methods:
    {
    },

    template: `

    <div>
      <h1>Dragable Test</h1>

      <draggable :list="list" class="drag-container">
        <div v-for="item in list" class="drag-item">{{ item }}</div>
      </draggable>

    </div>
`
});

从“/vue draggable”导入可拖动文件；
Vue.component（'fxm-form'{
名称：“fxm表单”，
道具：[
“formMode”
],
组成部分：{
拖动
},
数据（）{
返回{
列表：['AAA'，'BBB'，'CCC'，'DDD'，'EEE'，'FFF']
}
},
安装的（）{
},
方法：
{
},
模板：`
可排水性试验
{{item}}
`
});

使用

Vue.component（）

创建组件时，它会全局注册组件

根据官方消息：

全局注册必须在创建根Vue实例之前进行（使用新Vue）

这是因为您没有在Vue实例之前初始化组件

您可以在

Vue实例中注册组件

下面是一个工作示例