基于 vue 如何实现一个可插拔式的系统

[duanzs]

简单来说：写一个大项目，然后有很多小项目，大项目可以动态引用小项目（页面或组件）而无须重新打包发布 举个例子：大项目就好比是 vscode，小项目就是 vscode 的一个个插件，可以随意下载使用插件而不用每次都更新 vscode 版本，并且插件可以单独升级

[SilentDepth]

这不就是各种 Vue 组件库的效果？

活用 Vue.use()、Vue.component()、<component :is="?">

[duanzs]

@SilentDepth 请注意审题哈 项目是分开的，而且小项目升级部署都不用发布大项目

[SilentDepth]

是啊，element-ui 和业务应用的项目也是分开的啊，如果 element-ui 的引用方式是 CDN （ HTTP 链接），人家更新也不需要你重新发布业务应用啊

[mozhizhu]

其实跟 webpack 的热更新是差不多的想法；
比如服务器渲染的方法，例如 nuxt ；

[duanzs]

@SilentDepth 他就是个样式库，没可比性吧

[SilentDepth]

@duanzs #5 那好，Vue Router，这个不是样式库吧，要方法有方法，要组件有组件，你可以看看它是怎么做的。

[SilentDepth]

@duanzs #5 不要先入为主觉得 element-ui 就是个组件库所以没有参考性，其实大家的本质都是一样的，无非是动态注册的东西不一样而已。

[duanzs]

@SilentDepth 我觉的咱俩理解不一致，我的需求是能动态引入而无需重新打包发布的

[wly19960911]

首先理解路由懒加载原理，你就知道什么解决方案了。使用 requirejs 应该可以做到，但是现在的编译环境应该不行，因为项目的依赖已经完全被处理过了。

[sohu022]

目前我们这边也在基于 Vue 开发一个类似的项目管理平台， 主应用包含核心和通用的功能， 同时提供给用户开发插件的能力， 系统预埋一些扩展点， 用户可以使用插件来扩展系统的支持自定义扩展的块、 菜单、路由 等功能，
主应用与所有的插件都是单独编译的， 插件编译好跟随插件的后台服务一起打包成一个插件的 Java jar 包， 上传到系统中， 在管理后台可以针对特定的项目启用该插件， 应该跟楼主说的这种比较类似了

[sohu022]

每一个插件也可以单独启用某一个版本的该插件

[duanzs]

@wly19960911 应该不满足我需求，因为我要求主项目不需要每次都重新构建发布

[SilentDepth]

@duanzs #8 我说的就是「动态引入而无需重新打包发布」啊。

Vue 动态添加应用能力就是靠 Vue.use( )（以及相关的 Vue.mixin( )、Vue.component( )、Vue.directive( ) 等），接受的参数就是一个 Plain JS Object，那么你的问题就变成「如何在不重新编译引用者的情况下获得这个 Plain JS Object 」。最简单的，如楼上所说用 RequireJS，或者自己实现一个简单的异步模块加载器（动态添加 <script>，用全局函数得到模块内容），只要目标模块地址可以在运行时确定，模块引用者（主业务应用）就不需要重新编译和发布，目标模块暴露一个 install 方法传给 Vue.use( ) 去调用，就完事了。

我举 element-ui 和 vue-router 的例子，是因为它们也是这么做的。

[duanzs]

@sohu022 听起来别无二致，能普及一下技术栈吗

[duanzs]

@SilentDepth 我觉得还是有区别，你描述的引入 element-ui 和 vue-router，是因为你提前知道要引入这俩模块，但是你想一下 vscode，开发 vscode 的时候他们知道有多少插件吗？

[SilentDepth]

@duanzs #15 这个不重要呀，你需要的只是一个包的地址而已。我提 element-ui 和 vue-router 是为了引入具体场景来强调「异步加载」这个事儿，是不是 element-ui 不是问题的重点。

[Rorysky]

后端 动态链接库

[SilentDepth]

unpkg.com 上那么多包，你随便选一个得到地址，架设你刚好选的就是 element-ui，接下来不就和正常加载 element-ui 一个过程了？

[learnshare]

element 可不是个样式库，兄弟
你需要解决的是按需加载、注册和执行

[Rorysky]

前端比后端设计模式落后一个世纪，这个问题上个世纪都解决的很好