Example（async、建议）

// === Step 1 - 异步引入 ===

// SlugQA 实例
Vue.mixin({
  beforeCreate() {
    const options = this.$options
    if (options.qa) {
      this.$qa = options.qa
    } else if (options.parent && options.parent.$qa) {
      this.$qa = options.parent.$qa
    }
  },
})
// SlugQA 异步组件
let slugQaCompsCache = undefined
let slugQaComps = (name) => {
  if (!slugQaCompsCache) {
    slugQaCompsCache = import(
      /* webpackChunkName: 'slug-qa' */ '@tencent/slug-qa/dist/component.esm'
    )
  }
  return () => slugQaCompsCache.then((comps) => comps[name])
}
Vue.component('slug-qa-center-pane', slugQaComps('QaCenterPane'))
Vue.component('slug-qa-detail', slugQaComps('QaDetail'))
Vue.component('slug-qa-find', slugQaComps('QaFind'))
Vue.component('slug-qa-ask', slugQaComps('QaAsk'))
Vue.component('slug-qa-search', slugQaComps('QaSearch'))

// === Step 2 - 配置 ===
const slugQACfg = {
  options: {
    game: store.state.global.game,
    bhost: [
      'sy.qq.com',
      sessionStorage.igEnv == 'development' ? '' : 'test.ingame.qq.com',
    ],
  },
  theme: {
    colors: Object.assign({}, window.config.theme.color, {
      6: undefined, // 通用微社区已设置背景色，通用问答不用设置背景色
    }),
    searchbg: qaCfg ? qaCfg.searchbg : undefined,
    download: downloadNav.active
      ? {
          url: downloadNav.download_url,
          img: downloadNav.img_url,
        }
      : undefined,
  },
  nav: {
    back: true,
    find: {
      name: 'qa',
    },
    search: {
      name: 'qa',
      query: {
        qa_page: 'search',
      },
    },
    ask: {
      name: 'qa',
      query: {
        qa_page: 'ask',
      },
    },
    detail(id) {
      console.log('detail', id)
      return {
        name: 'qa-detail',
        params: { id },
      }
    },
  },
  inject: {
    // UI 组件
    SlugUI: { Toast },
    // 分享组件：需要sdk支持：msdk3->1 msdk5->2 其它->1
    SlugShare: `https://tiem-cdn.qq.com/slugteam/components/share/v${
      ingameEnvCheck.slugQAMSDKV5 ? 2 : 1
    }.0/slug-share.min.js`,
    shareURL: (qid) =>
      sessionStorage.igEnv === 'development'
        ? `https://test.ingame.qq.com/${store.state.global.game}/common/#/qa/share/${qid}`
        : `https://sy.qq.com/${store.state.global.game}/ingame/#/qa/share/${qid}`,
    shareImg: `https://tiem-cdn.qq.com/sy/${
      store.state.global.game
    }/ingame/images/${
      sessionStorage.igEnv === 'development' ? 'test_' : ''
    }qashare.png`,
    // 上报组件
    report({
      type,
      en,
      zh,
      targetid,
      action = 'pop',
      targettype = 'other',
      from = 'ingame',
    }) {
      console.log(type, en, zh)
      // mta.reportStat(en);
      targetid
        ? dmp.report({
            action,
            targetid,
            targettype,
            from,
          })
        : PTTSendClick(type, en, zh)
    },
  },
}
Vue.mixin({
  beforeCreate() {
    this.$qaCfg = slugQACfg
  },
})