仅插件服务器端

Question

我有一个不希望客户看到的插件。不幸的是，它总是为服务器和客户端构建的。如何预防？

<template>
    <div>
        Test
    </div>
</template>

<script>
    import getAll from '~/plugins/api'
    export default {
        asyncData (context, callback) {
            getAll(function(data){
                callback(null,data);
            })
        }
    }
</script>

这是我的 .vue 文件。数据的获取工作正常，但我也可以从客户端看到我不想要的代码。

Answer 1

也许你可以使用 context.isServer 属性.
这是一个布尔值，让您知道您是否真的是服务器端的渲染器。

<script>
import getAll from '~/plugins/api'
export default {
    asyncData (context, callback) {
        if (context.isServer) {
            getAll(function(data){
                callback(null,data);
            })
        }
    }
}
</script>

有关 Nuxt 上下文的更多详细信息：https://nuxtjs.org/api/context

更新：（感谢@Lanayx）

"Note: Since Nuxt.js 2.4, mode has been introduced as option of plugins to specify plugin type, possible value are: client or server. ssr: false will be adapted to mode: 'client' and deprecated in next major release."

// nuxt.config.js:

export default {
  plugins: [
    { src: '~/plugins/both-sides.js' },
    { src: '~/plugins/client-only.js', mode: 'client' },
    { src: '~/plugins/server-only.js', mode: 'server' }
  ]
}

仅插件服务器端

Plugin only server side

nuxt.js