vue之babel自动埋点

公司项目是vue单页面技术,这天组长对我说,为了凸显我们的作用,做点外行或者新手看起来高深的东西,例如自动埋点。
当时我的表情先是vue之babel自动埋点_第1张图片
然后摸鱼摸习惯了,就是这种状态。
vue之babel自动埋点_第2张图片
最后组长说领导的态度决定我们的绩效,没办法,为了money,无奈打开了老朋友——google。

搜索自动埋点,果然——现成的劳动果实,真香!

原文: 手撸自动埋点.
给作者点个赞!!!
不过用于我们的项目有几个要改动的地方:

vue之babel自动埋点_第3张图片

vue之babel自动埋点_第4张图片
这里如果参数错误就跳过的写法对于我们来说不合适,所以给注释了。

vue之babel自动埋点_第5张图片
vue之babel自动埋点_第6张图片
这里的路径要兼容一下,报错原因小白看不懂(别装小白)。
vue之babel自动埋点_第7张图片

vue之babel自动埋点_第8张图片

因为是vue项目,babel-loader处理的是项目下所有的.js文件
vue之babel自动埋点_第9张图片
所以我有了下面的操作:
vue之babel自动埋点_第10张图片
vue之babel自动埋点_第11张图片
可悲哀的发现好像一点效果没有。。。
在这里插入图片描述
大佬写的代码是没问题的,于是我尝试在.babelrc中写入,于是有了下面的操作:
vue之babel自动埋点_第12张图片
结果成功了?!!
vue之babel自动埋点_第13张图片
张三表示很欣慰!
vue之babel自动埋点_第14张图片
为此本人做了总结:这是babel插件,当然得写在babel相关的里面了,而.babelrc正是处理.vue文件的js的。
咳咳,至于插件的开发过程,原文写的很详细,插件源码,举例都有,感谢原文作者的奉献。
vue之babel自动埋点_第15张图片
至于我的源码,不给!(我才不是懒得上传)
最后,下班。

你可能感兴趣的:(vue.js,前端,javascript)