Skip to content
| Marketplace
Sign in
Visual Studio Code>Other>Hubble-sdk-web版的VSCode插件New to Visual Studio Code? Get it now.
Hubble-sdk-web版的VSCode插件

Hubble-sdk-web版的VSCode插件

hzwangyang1

|
505 installs
| (0) | Free
Hubble-sdk-web版的VSCode插件,提供sdk引入、初始化、代码补全
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

Hubble sdk web版辅助插件

功能说明

当前支持鼠标悬浮提示、api代码补齐、sdk初始化、注释替换为埋点代码。
当前支持的文档格式:

    "onLanguage:javascript",
    "onLanguage:typescript",
    "onLanguage:ftl",
    "onLanguage:html",
    "onLanguage:vue",
    "onLanguage:javascriptreact"(jsx)

api代码补齐

当输入 'DATracker.'后,会自动提示sdk的各个api;

鼠标悬浮提示

当鼠标停留在sdk的api上,会提示该api的说明,比如停留在DATracker.get_user_id()的'get_user_id'上,就会提示'get_user_id'的使用说明。

sdk初始化

改方式采用代码片段方式实现。

输入 hubbleSdk后,会弹出列表选项,按照后面的说明选择代码片段。
功能为: hubbleSdk-Web版sdk异步引入方式、hubbleSdk-Web版sdk同步引入方式、hubbleSdk-Web版sdk自动升级方式、hubbleSdk-Web版sdk初始化_默认。

注释替换为埋点代码

格式:

// @hubble-sdk-web event=test

@hubble-sdk-web 表示需执行替换, 'event=' 后面紧跟着事件名称

例子


const func = () => {
    // @hubble-sdk-web event=test
}

然后右键选中 “Hubble-sdk 全局替换”,上面注释解析后结果:

const func = () => {
    DATracker.track(enter)
}

事件配置

在 package.json 所在的目录下,新建一个 hubble-sdk-web.json 文件,该文件全局配置埋点事件,内容结构如下:


{
    "alias": "DATracker",
    "events": [
        {
            "event": "clickIn",
            "attributes": {
                "productId": "",
                "name": ""
            }
        }
    ]
}

以下为配置说明:

alias

hubble 的自定义别名,默认:DATracker, 假如自定义为 hubbleSDK ,那 alias: 'hubbleSDK' ,解析后效果:

原:


const func = () => {
    // @hubble-sdk-web event=test
}

解析后:

const func = () => {
    hubbleSDK.track(enter)
}

events

events 为需上报的事件集合,每一个元素表示 一个事件。

比如要上报一个 事件:clickIn,自定义事件属性为 productId: '', name: '',那么hubble-sdk-web.json 文件如下定义:


{
    "alias": "DATracker",
    "events": [
        {
            "event": "clickIn",
            "attributes": {
                "productId": "",
                "name": ""
            }
        }
    ]
}

再执行编译效果

原:


const func = () => {
    // @hubble-sdk-web event=clickIn
}

解析后:
```js
const func = () => {
    DATracker.track('clickIn', {
        productId: '',
        name: ''
    });
}
  • Contact us
  • Jobs
  • Privacy
  • Manage cookies
  • Terms of use
  • Trademarks
© 2025 Microsoft