PHP模拟webpack编译VUE的辛酸史

原创 qinuoyun 随笔 心得 102阅读 2018-08-28 09:42:59 举报

很长时间没有在前端网出没了 距离自己发布的最后一篇文章都快要1年了吧
现在连打标点的习惯都去掉了 好了 言归正传 我实际是PHP后端开发人员 虽然在某种定义上 PHP也属于前端开发

接触VUE也两年多了 之前一直是用webpack打包的单例VUE 但是开发过程中遇到一些问题
1.项目大的时候 单例加载过多
2.RBAC 路由控制问题
3.上线调试问题 (以前MAC出了什么问题 直接上去改 现在改了还得编译)

光光这3大点 就已经非常头痛了 在与PHP的结合上就很大问题 PHP只负责API接口 Vue 只负责页面 总算是把前端和后端真正的分开了 对于小型的来说 确实很好用
当在开发后台是RBAC的控制 找遍了百度谷歌 几乎也只是防君子 不防小人的节奏

虽然VUE可以直接通过script标签引入但是在书写上就显得非常麻烦 整体界面就失去了Vue原本的一些特点 因此有异想天开的想用PHP来模拟webpack的形式

于是开始尝试 这个开发过程 一进去就碰到难点就是router-view标签的实现 于是就先放弃router-view 先能通过PHP把下面代码格式的转换成最终需要的

在这里通过PHP正则表达式 解析出来了 template style script标签的内容
但是在输出的过程中遇到了export default 在JS中是不能直接识别的 具体就不多说 可以自己百度搜一下 毕竟是是ES6的东西 没有办法 再通过正则匹配把export default 替换成var default1 的形式 这里就需要自己的去拼装HTML代码
拼装的部分如下

到这里只实现了单个页面VUE的书写可以编程浏览器可以直接解析的样子 然后组件部分以及import解决方案都是大难题
上面的可以编译输出如下:

后面再来讲讲组件的解决方案吧

评论 ( 0 )
最新评论
暂无评论

赶紧努力消灭 0 回复