工兵如何在全球范围内使用第三方库

时间:2019-08-14 00:19:42

标签: javascript svelte gun sapper

我想在服务器端和客户端访问变量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变量sun。)或rpc(与Bitcoin连接)-我可以举很多例子,其中这可能很重要。

在某处我读到您需要通过rollbar来实现这一点,在某处我读到一个关于常规模块(es6.svelte)的地方-但是随后我遇到了许多其他问题...

1 个答案:

答案 0 :(得分:0)

我真的没有看到直接的问题,但是我只是猜测...您正在尝试在svelte中使用全局变量(从nuxt移出)?

Svelte使用汇总,并且您的根目录中应该有一个.rollup.config.js文件。

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

有关(我认为您的问题所在)的更多文档,包括全局变量。 https://svelte.dev/docs#Compile_timehttps://github.com/rollup/rollup-plugin-svelte