一、友盟统计

首先进入到网站统计(U-Web),进入立即使用添加站点

已添加站点列表

进入到列表中设置中

站点设置

统计代码添加到相应页面，即可在统计报表中看到相应数据

在单页面应用vue项目中只能在index.html或App.vue中添加统计代码

const script = document.createElement('script')

script.type = 'text/javaScript'

//var text = script.textContent //|| script.innerText;

document.body.appendChild(script)

script.innerText = `var cnzz_protocol = (("https:" == document.location.protocol) ? " https://" : " http://");document.write(unescape("%3Cspan id='cnzz_stat_icon_1274572762'%3E%3C/span%3E%3Cscript src='" + cnzz_protocol + "s19.cnzz.com/z_stat.php%3Fid%3D1274572762' type='text/javascript'%3E%3C/script%3E"));`

这种方式在vue项目的其它页面中添加失败，具体原因还在研究

二、百度统计

由于项目需要要在vue单页面中添加统计代码，故尝试了百度统计

首先进入到百度统计-网站统计，切换到管理中可新增网站站点

已添加站点列表

在不同vue单页面中添加以下代码即可统计该页面实时统计情况

var hm = document.createElement("script");

hm.src = "https://hm.baidu.com/hm.js?c3ef6baa8be225860b6ddba3b33d5ba6";

var s = document.getElementsByTagName("script")[0];

s.parentNode.insertBefore(hm, s);

总结：目前只是尝试了这两种方式，还没有在具体的项目中使用，具体适应与否还得后期通过项目中实践并通过严格测试方可。