Сапер. Как глобально использовать сторонние библиотеки

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 соединение (тогда мы передали бы ws переменное солнце таким же образом.), или RPC (для соединения с Bitcoin) - Я могу привести много примеров, где это может быть важно.

Где-то я читал, что вам нужно реализовать это через rollbarгде-то читал про штатный модуль (es6 или же .svelte) - но потом я сталкиваюсь с рядом других проблем...

Answer 1

Я не вижу прямого вопроса, но я просто угадаю... вы пытаетесь использовать глобальную переменную в svelte (переход от nuxt)?

Svelte использует накопительный пакет, и у вас должен быть файл.rollup.config.js в корневом каталоге.

export default {
...
    plugins: [
        svelte({ 
           // magic happens here
        })
    ]
}

Больше документации по (что я думаю, что ваша проблема), включая глобальные. https://svelte.dev/docs & https://github.com/rollup/rollup-plugin-svelte