nuxt 启动时预加载数据到 store答案

【问题标题】：Preloading data to the store at startup in nuxtnuxt 启动时预加载数据到 store
【发布时间】：2021-03-05 07:58:26
【问题描述】：

我正在使用 Nuxt 开发一个应用程序，我在 nuxtServerInit 预加载了一些东西并将其放入商店。没关系，没有问题。

我有更多具有相同类型初始预加载的项目 - 所以我开始认为将逻辑放入模块中是个好主意，我所有其他项目都可以将模块添加到 nuxt.config.js 和store 将被预填充...我开始创建模块并发现，此时无法到达 store，对吗？

我尝试了nuxt.hook('ready', (nuxt) => {...}，但回调中的 nuxt 参数没有存储引用。

我是 Nuxt 的新手，也许我错过了一些要点或以错误的方式处理我的预加载问题？

这是我的modules/mymodule.ts

const mymodule: Module<Options> = function (moduleOptions: Options) {
  const { nuxt } = this

  nuxt.hook('ready', async (__nuxt: any) => {
    // __nuxt ... no store reference :(
  })
}
export default mymodule

【问题讨论】：

标签： typescript nuxt.js

【解决方案1】：

我不得不做类似的事情。我认为您应该在moduleOptions 中寻找商店。

在我的实例中，为了访问商店，我创建了一个插件。

// nuxt.conf.js

buildModules: [
    '@namespace/node_modules_route',
]

// 插件.js

// When initializing module in nuxt.config, only the plugin is moved 
// (not deps) so it doesn't resolve via relative import.
// SEE: https://github.com/nuxt/nuxt.js/issues/6169
import SomeStore from '@namespace/node_modules_route/store'

export default function ({ store }) {
  store.registerModule('cxl-session', SomeStore())
}

// 模块.js


module.exports = async function (moduleOptions) {
  const options = {
    ...this.options['my-plugin'],
    ...moduleOptions,
  }

  this.addPlugin({
    src: resolve(__dirname, 'plugin.js'),
    fileName: 'my-plugin.js',
    options,
  })
}

module.exports.meta = require('../package.json')

【讨论】：