嘗試使用 https://www.npmjs.com/package/vue-fb-customer-chat 這個套件，

在 main.js 引入

import Vue from ‘vue’
import VueFbCustomerChat from ‘vue-fb-customer-chat’
Vue.use(VueFbCustomerChat, {
page_id: 1234567897,
theme_color: ‘#333333’, // theme color in HEX
locale: ‘zh_TW’, // default ‘en_US’
}

然後在 App.vue 加入
<div id="fb-root"></div>
<div class="fb-customerchat" page_id="1234567897" logged_in_greeting="親愛的，我能幫上你什麼🙋‍♂️" logged_out_greeting="親愛的，我能幫上你什麼🙋‍♂️">

以上這個方法失敗，會跳 Error：

Uncaught TypeError: Cannot set property 'execStart' of undefined**
at 869067926891516?v=2.9.15&r=stable:20**
at 869067926891516?v=2.9.15&r=stable:20**
at 869067926891516?v=2.9.15&r=stable:20**

Refused to display "https://xxxxxxxxxx........" in a frame because an ancestor violates the following Content Security Policy directive: "frame-ancestors https://www.facebook.com".

已檢查粉絲專頁有加入網域白名單，不知道是哪邊沒設定好，或是流程有誤QQ

－－－－－－－－－－－－－－
有嘗試自己手動塞 粉專提供的程式碼到 index.html 文件裡，也是跳一樣的錯誤。
粉專程式碼：

      <div id=“fb-root”></div>
      <script>
        window.fbAsyncInit = function() {
          FB.init({
            xfbml            : true,
            version          : ‘v6.0’
          });
        };
        (function(d, s, id) {
        var js, fjs = d.getElementsByTagName(s)[0];
        if (d.getElementById(id)) return;
        js = d.createElement(s); js.id = id;
        js.src = ‘https://connect.facebook.net/zh_TW/sdk/xfbml.customerchat.js’;
        fjs.parentNode.insertBefore(js, fjs);
      }(document, ‘script’, ‘facebook-jssdk’));</script>
      <!-- Your customer chat code -->
      <div class=“fb-customerchat”
        attribution=setup_tool
        page_id=“123456789”
        logged_in_greeting=“親愛的，我能幫上你什麼”
        logged_out_greeting=“親愛的，我能幫上你什麼“>
      </div>