Vue.js 和 Nuxt.js

Posted 2023-02-23

【中文标题】Vue.js 和 Nuxt.js

【英文标题】：Vue.js and Nuxt.js

【发布时间】：2018-06-10 08:46:16

【问题描述】：

您好，首先感谢那些回答这个问题的人。这个问题可能愚蠢 问。 我正在将我的水疗中心从 vue.js 切换到 vue.js 提供的 nuxt，但现在写到我很麻烦，因为整个 nuxt 的工作方式之间的可见性为 0%。

问题：

如何注册全局组件。 如何在客户端行为的某些用户上切换 nuxt 中的布局。 在哪里编写 vue.use(someplugin)。 如何编写中间件导出方法，该方法使用用户 ip 连接到服务器而不是加载页面。 vue.js中如何处理环境变量 如何将数据从任何中间件和插件传输到我正在使用的组件。 有什么方法可以分离 vue 组件以及各自的方法和数据。

由于我无法继续我的项目而导致的当前问题

在 ~plugins/registerPlugin.js 中使用 vue.use(plugins) 注册模块，例如：

    'use strict';

    /*
    MODULE IMPORTS
    */

    // npm modules.
    import Vue from 'vue';

    // temp modules. ex modules for registration.
    import __vueCookie from 'vue-cookies'; // npm: provide cookie set and get.
    import __veeValidate from 'vee-validate'; // npm: provide field validation.
    import __moment from "vue-moment"; // npm: filter plugin for vue.js.
    import __vueLocalStorage from 'vue-localstorage'; // npm: provide local storage api.
    import __vueSessionStorage from 'vue-session'; // npm: module for managing session storage.
    import __vueResource from 'vue-resource'; // npm: vue resource library.


    /*
     PLUGIN REGISTRATION
    */

    // use vue resource library.
    Vue.use(__vueResource);

    // vue validate for input validation.
    Vue.use(__veeValidate);

    // vue filter plugin for date and time.
    Vue.use(__moment);

    // cookie plugin manager for vue.
    Vue.use(__vueCookie);

    // local storeAge manager for vue.
    Vue.use(__vueLocalStorage);

    // session storage manager for vue.
    Vue.use(__vueSessionStorage);

【问题讨论】：

我建议在开始之前阅读 Nuxt 网站上的整个指南。我想你的很多问题都在那里得到了解答：nuxtjs.org/guide

【参考方案1】：

这是我对问题 1-5 的回答。 6和7对我来说并不完全清楚。也许您想重写它们？

如何注册全局组件。

在/plugins中创建一个插件文件，然后添加到nuxt.config.js

plugins: ['~/plugins/components.js']

Have a look here.

如何在客户端的某些用户上切换 nuxt 中的布局 行为。

Have a look into this discussion

在哪里写 vue.use(someplugin)

您可以将它们添加为“nuxt”插件，并将它们也添加到nuxt.config.js。 Have a look here how to do it.

vue.js中如何处理环境变量

您也在nuxt.config.js 中设置它们。 See here.

【讨论】：

谢谢先生的回复，您能告诉我在哪里放置在组件中重复的方法，并且是静态文件夹，适合包含配置文件。