老哥们，问一下， vue 写的项目，页面上可以做成模块吗？比如说 页面上预留一块地方，可以让客户自己写模块，或者我们写模块让他下载，然后自动加载到页面上

[moocean]

可以实现这样的效果吗？有没有类似的网站可以参考？应该怎么来实现？
求救😂

[moocean]

求前端大佬回复一下呗

[Vegetable]

http://www.runoob.com/try/try.php?filename=tryhtml_intro
是这种吗?

[moocean]

@Vegetable 老哥不是这个，就是类似谷歌插件这样，不过插件的作用范围是项目，老哥，你这个是编辑器，然后的运行结果啊

[learnshare]

iframe?

[unhappy224]

可以吧，template 本来就是字符串啊

[whypool]

可以搞，成本相当于搞 erp 系统

首先要有一个拉取 vue 文件的管理系统，除了 vue 文件之外，还要一个描述文件，这个文件功能是什么

然后，重点来了，分析描述文件，是插入组件还是插入页面

组件是否有依赖，如果有，在源码目录执行 npm i
分析组件插入的目标页面，生成模板指令标签，引用模板
如果有子父组件传值，需要更改传入参数和返回结果，需要分析 data 和 methods 里面的代码

如果是独立的页面，重复上面的步骤，然后分析是否有 vuex 状态管理，是否有路由以及路由权限，路由参数

这些都搞完，就可以执行 build 生成新文件

简单点就直接搞一套正则规则去分析源码，按特定格式写模板，复杂点上机器学习分析源码，先训练个几百亿次，准确度 99%就行

[moocean]

@learnshare 这个标签可以大量用吗，再页面上？会不会影响性能

[moocean]

@whypool 老哥，这个成本很高啊，我们这个因为是操作数据库的，和 phpadmin 差不多，这样搞老难了，前端还我一个，还有 poc 压力

[moocean]

能不能这样，模块写好，隐藏起来，然后做一个市场，他安装了某个模块，就让那个模块显示出来，伪的实现

[AlphaTr]

```
const component = fetch("http://example.com/component.js")

new Vue({
render(createElement) {
return createElement(component, {props})
}
}).$mount().$el
```

这样子动态渲染别人的模块应该就可以

[airyland]

将客户代码插入相应位置直接在服务端 build 就行了，虽然不够灵活实时，但是简单粗暴。

[moocean]

@airyland 老哥，那自己的代码，如何实现模块的添加，删除啥的，总觉得，模块隐藏，显示不太好，还有这个，插入相应位置，怎么插入呢，vue 已经打包好的前端代码咋放进去，老哥，我还是个菜鸡，不太懂

[moocean]

新的代码插件如何插入到老代码呢？

[InternetExplorer]

空着的位置放个 div，给一个唯一的 ID，要某个组件的时候加载那个组件的 js 文件，vue 就挂到那个 div 上

[jadec0der]

可以让客户装油猴写脚本

[1KN6sAqR0a57no6s]

@InternetExplorer 我也觉得是这样。但是楼上的老哥都已经要上机器学习了，就没敢说话。

[momocraft]

加钱 找人

[moocean]

也就是说，当我点击安装某个插件的时候，这个组件就挂到空 div 上了，然后各种操作预设好，可以直接用，那这样还是要在服务器 build 把，再别的电脑登录了，就没有这个组件了，是不是需要后台需要记住组件的状态，安装了还是未安装

[moocean]

@momocraft 这个就很难了，老哥，小公司，小公司，救我菜鸡前端

[moocean]

@jadec0der 这个不可能的把，毕竟用户不是都会脚本，还有，项目里面的报表都是以编辑器写代码形式做的，和 echarts 实例那样差不多的操作，只不过里面数据替换