bp_common_two

适用说明

埋点通用方法 [适用于cli创建的webpack老版本]

bp_common_two

私有库地址： npm私有库

插件使用方法

安装 bp_common_two

npm install bp_common_two
# NOTE: or
yarn add bp_common_two

全局引入

• vue2

import buried from 'bp_common_two'
Vue.use(buried)

• vue3

import buried from 'bp_common_two'
app.use(buried)

埋点参数标准

行为列表

参数统一建议

// FIXME: 建议
- 存储到vuex中的参数：
{
	client_version,action_type,user_type
}
- 当前页面变动参数
{
	user_id
}
- 需要单独设置的参数
{
	action_id,
}
- 封装方法导出的参数
{
	connection_id,current_view_id,event_id,arise_time
}
- 扩展参数
 {
	phone_num,product_name,product_id,source_platform,advertising
 }

参数进行assign即可，目前的常量参数没有进行封装，后面可以进行代码级的优化

优化建议

• 常量参数封装
• 方法参数统一
• 指令和全局函数使用
• 埋点添加标识

页面使用

• vue2

// HACK: 埋点节点 根据实际业务进行更改
<input v-track="params"/>
<button @clicl="buried">click埋点节点</button>
export default {
	data(){
		return {
			//HACK: 参数请根据埋点参数标准进行配置 此处请根据实际业务进行参数配置
			action_id: 'params_action_id of yourself',
			action_type: 'click',
			extend:{
				sourcePlatform : "",
				advertising : ""
			}
		}
	},
	methods:{
		 methods: {
			buried() {
			this.$track(this.params);
		},
	}
}

• vue3

// HACK: 埋点节点 根据实际业务进行更改
<input v-track="params"/>
<button @clicl="buried">click埋点节点</button>
import { getCurrentInstance ,reactive} from "vue";
const { appContext } = getCurrentInstance();
const globalProxy = appContext.config.globalProperties;
// HACK: 参数请根据埋点参数标准进行配置
const params = reactive({
				action_id: 'params_action_id of yourself',
				action_type: 'click',
				extend:{
					sourcePlatform : "",
					advertising : ""
				}
})
let buried = () => {
  globalProxy.$track(params);
};

环境变量

• vue2

# NOTE:  vue2 执行配置
NODE_ENV = 'develpoment'
VUE_APP_RUN_MODE = dev

• vue3

# NOTE:  vue3 执行配置
NODE_ENV = 'develpoment'
VITE_RUN_MODE = dev

暴露方法和指令

1、全局挂载指令 v-track="trackData" //主要用于曝光

2、暴露全局方法 $track(this.trackData); //主要用于点击

常见问题解决

问题一： vite3项目出现process is not defined

• 解决方式: 打开vite.config.js

define: {
		'process.env': process.env
	}

问题二： vue项目中出现VUE_APP_RUN_MODE is not define

• 解决方式：添加对应的env文件 并添加对应的VUE_APP_RUN_MODE配置参数

问题三：vite3创建的项目无法进行环境区分

• 解决方式： 配置package.json

 "scripts": {
   "dev": "vite serve --mode development",
   "prod": "vite serve --mode production",
  },

特殊字段：user_type: "user_id", //默认是user_id 如果存在别的officialUserId 的时候 需要将officialUserId 传到extend里面

特殊说明

埋点函数地址为公司内部使用，仅限公司内部项目使用