javascript - サッパー。サードパーティ ライブラリをグローバルに使用する方法

Question

gunサーバー側とクライアント側の変数にアクセスしたい。

これは私のモジュールです:

import Gun from 'gun/gun'
import Sea from 'gun/sea' // eslint-disable-line no-unused-vars

export const gun = Gun({
  localStorage: true,
  radisk: true,
  peers: ['http://localhost:8765/gun']
})

Nuxtを優先して放棄したいだった場合、次のSapperように実装します。

import Gun from 'gun/gun'
import 'gun/sea'
import 'gun/lib/open'

const gun = Gun({
  localStorage: true,
  radisk: true,
  peers: ['http://localhost:8765/gun']
})


export default ({ app }, inject) => {
  inject('gun', () => gun)
}

// nuxt.config.js
...
plugins: [{ src: '@/plugins/gun.js' }]
...

したがって、私は$gunどこにでもアクセスできます：

サーバー側:

export default {
  asyncData(context){
    context.app.$gun()
  }
}

そしてクライアント側では：

  methods: {
    submit() {
      const gun = this.$gun()
      const user = this.$gun().user()
      ...
    }
  }

また、テンプレートで：

<template>
  <div>{{ $gun }}</div>
</tempalte>

この質問は、質問で議論されている特定のライブラリの使用には関係ありません ( gun)。これは、Websocet接続 (変数 sun を同じ方法で渡しwsます) または rpc ( と接続するBitcoin) のいずれかです。これが重要になる例をたくさん挙げることができます。

を介してこれを実装する必要があることをrollbarどこかで読んだり、通常のモジュール（es6または.svelte）について読んだりしましたが、他の多くの問題に遭遇しました...