remaxjs

remaxjs

1.注册友盟+账号

参考官网原生小程序文档

2.友盟官网申请小程序appkey

参考官网原生小程序文档

3.域名白名单配置

官网微信小程序文档 官网原生支付宝小程序接入

4.创建remaxjs框架下的app

demo_on_github 如果是旧工程，首先升级remax版本>=v1.19.0 然后在remax.config.js开启one: true

module.exports = {
    one: true,
    output: 'dist/' + process.env.REMAX_PLATFORM
};

如果是新工程，直接按照官网方法初始化

npx degit remaxjs/template-one my-app
cd my-app

5.安装sdk

cd path-to-remaxproject
npm install umtrack-alipay --save
npm install umtrack-wx --save

6.跨平台集成最佳实践

不能像taro一样动态require 原因参见 本教程使用文件名后缀区分不同平台代码,跟taro多文件跨平台类似，参考reamx 跨平台介绍

src/uma/index.wechat.js 定义微信小程序环境需要导入的模块并初始化

import uma from 'umtrack-wx';

uma.init({
    appKey: 'YOUR_APP_KEY',
    useOpenid: false,
    autoGetOpenid: false,
    debug: true
});
export default uma;

src/uma/index.alipay.js定义支付宝小程序需要导入的模块并初始化

import uma from 'umtrack-alipay';

uma.init({
    appKey: 'YOUR_APP_KEY',
    debug: true
});
export default uma;

src/uma/index.js

export { default } from  './index.wechat';

app.js

import '@/uma';//app.js中 uma模块一定要放在最前头
import './app.css';

const App = props => props.children;
export default App;

7.自定义事件

pages/index/index.js导入uma模块

import  { useReady } from 'remax';
import uma from '@/uma';

export default () => {
  useReady(()=>{
    uma.trackEvent('buy',{car:'bmw'});
  });
  return 'showtime';
};