前期準(zhǔn)備工作(必要)

1:首先擁有有個(gè)微信公眾號并且配置相關(guān)信息（JS接口安全域名，網(wǎng)頁授權(quán)域名）
2:需要微信小程序的appId
3:擁有H5網(wǎng)頁程序

下載weixin-js-sdk

npm install weixin-js-sdk

插件引入使用功能性代碼

import wx from 'weixin-js-sdk'

getWXUserSign({
    url: url
}).then(res => {
    wx.config({
        debug: false, // 開啟調(diào)試模式,調(diào)用的所有api的返回值會(huì)在客戶端alert出來，若要查看傳入的參數(shù)，可以在pc端打開，參數(shù)信息會(huì)通過log打出，僅在pc端時(shí)才會(huì)打印。
        appId: res.appId, // 必填，公眾號的唯一標(biāo)識
        timestamp: res.timestamp, // 必填，生成簽名的時(shí)間戳
        nonceStr: res.nonceStr, // 必填，生成簽名的隨機(jī)串
        signature: res.signature, // 必填，簽名
        jsApiList: [
            'updateAppMessageShareData',
            'updateTimelineShareData',
            "onMenuShareAppMessage"
        ], // 必填，需要使用的JS接口列表

    })

           <wx-open-launch-weapp id="launch-btn" username="gh_開頭的id" path="跳轉(zhuǎn)路徑" @launch="sucFun"
      @error="errFun">
                <script type="text/wxtag-template">
                   <style>.guideBtn{width: 347px;
                     height: 50px;
                     background-color: #ff6611;
                     border-radius: 2px;
                     color: #fff;
                     font-size: 16px;
                     line-height: 50px;
                     text-align: center;}</style>
                   <div class="guideBtn">跳轉(zhuǎn)</div>
                 </script>
    
    </wx-open-launch-weapp>




//方法中調(diào)用初始化
wx.init()

剩下的樣式自己調(diào)下就ok