制作发布到npm的vue组件时依赖的第三库怎么处理?

Question

我现在需要将自己的一个基于 ant vue table 组件增强的一个 MyTable 组件, 抽取, 打包, 发布到npm上. 由于依赖的 ant vue 的 Table,Card,Breadcrumb 三个组件.
本地测试了下, 打包好 MyTable npm 包后, 另一个demo工程引入使用, 报错: vue.esm.js?efeb:628 [Vue warn]: Unknown custom element: <a-card> - did you register the component correctly? For recursive components, make sure to provide the "name" option.. 我在 MyTable 通过 Vue.use(Table)... 不起作用.
请问怎么解决这个问题呢?

我想要的效果是:
其他工程引用 MyTable 组件时, 只需要 npm install mytable 就可以了, 而不需要关心是否依赖了 ant vue 的组件, 更不需要关心怎么注册 ant vue 的组件.

--- 更新 2020-1-19 10:16:30 ---
目前发现, 在我自己的组件 mytable 中, 通过 import + components 可以解决这个问题. (方式1)

import { Table,Card,Breadcrumb } from 'ant-design-vue';
components: {ATable:Table, ACard:Card, ABreadcrumb:Breadcrumb},

但是下面这个方式貌似没有效果: (方式2)

DrillTable.install \= function(Vue) {  
  console.log('drill table 0 install ...');  
  Vue.use(Table);  
  Vue.use(Card);  
  Vue.use(Breadcrumb);  
  Vue.component(DrillTable.name, DrillTable);  
};  
  
  
export default DrillTable

方式1 倒是可以解决问题, 但是 一旦依赖组件比较多, 且有嵌套依赖问题时 这样一个import 应该是不现实的.

所以, 还是没有解决我的问题~

Answer 1

1. 你的问题和问题描述是两个问题
2. 关于注册组件，你可以参考官方的做法，使用 Vue.use() API
3. 第三方依赖放在 package.json 的 dependencies 里，然后通过 webpack.externals 避免打包就好了

Answer 2

导出的对象必须有install方法才可以被vue.use() 我试了下，第二种方法是可行的