vue 组件拓展，如何提供组件拓展功能使用户可以添加新的组件

[Gaays]

想问一下大家，现在项目中有一套多组件（ components ）页面，想给用户提供自定义添加组件的能力，如何在不提供源码的前提下提供这样的功能，可以实现吗？

[redtech]

低代码？

[Gaays]

@redtech 差不多，但是颗粒度没那么细

[zzt]

vue 本身是支持动态注册，https://v2.vuejs.org/v2/guide/components-dynamic-async.html 。

[zzt]

@zzt 只要用户提供的组件 JS 符合 vue 组件的数据格式，然后传参 /出参定义好文档。不过由于你这个需求描述不是很清楚，所以也给不出更细化的实现

[Gaays]

@zzt 就是类似低代码，开发了基础的一些组件，如果用户想添加自定义组件，得提供让用户添加自定义组件的功能，但是同时不提供源码，根据 vue 开发文档，我想到的解决方法是：项目中有一个自定义组件的文件夹，运行时通过动态读文件然后在这个页面引入，实现自定义组件功能？

[9tao]

用户在你的平台上注册组件，提供 umd 规范并且符合你平台注册规范的组件的 js cdn 地址，在项目启动时动态加载这些 js

[doommm]

不光是 js ，附带的 css 也要一并加载

[leonkfd]

利用动态组件即可，<component :is="userSelectComponent" />
最近也开发过一个浏览器起始页，也是能让用户自行去选择自己合适的组件去搭建自己的起始页，组件也是动态按需加载，由用户决定，有空感兴趣可以参考下。
https://howdz.vercel.app

[waiaan]

如果没理解错，这个组件应该是事先不存在的。
你可以准备一个文件夹专门用来放用户自定义的组件，webpack 有个功能是可以读取一个文件夹下的所有文件，然后再用上面几位说的方法注册为 vue 的动态组件。

[waiaan]

https://www.webpackjs.com/guides/dependency-management/#require-context

[Gaays]

@waiaan 你说的对我刚刚就在想这个 require.context

[zzt]

@Gaays 和用户的代码最彻底的隔离就得像 @9tao 说的让用户直接提供组件打包完成后的访问地址。但是这样把组件的控制权完全交给用户感觉不太安全。以前百度 MIP 也有个类似的需求，就是站长需要自定义 MIP 组件，他们是单独搞了个仓库，让站长提交组件代码，然后审核。我觉得你也可以这样，搞个外部组件仓库，用户提交组件到这，然后这个组件仓库作为主仓库的 submodule ，再怎么动态导入就可以用上面说的那些方式了。

[Gaays]

@zzt 好，谢谢提供建议和案例！我想想应该怎么处理