时间戳

首页 > 解决方案 > 工兵。如何全局使用第三方库

javascript - 工兵。如何全局使用第三方库

问题描述

我想访问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']
})

如果它是 a Nuxt，我想放弃它以支持 a 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）来实现这个 - 但后来我遇到了许多其他问题......

标签： javascriptsveltegunsapper

解决方案

我真的没有看到直接的问题，但我只是猜测......你试图在 svelte 中使用全局变量（从 nuxt 移动）？

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

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

更多关于（我认为你的问题是）的文档，包括全局变量。 https://svelte.dev/docs#Compile_time & https://github.com/rollup/rollup-plugin-svelte

推荐阅读