使用外部json填充路由器

我想将路由从外部json文件添加到我的Nuxt应用程序,该文件可以在运行时更改。这里可以找到类似的主题

我已经用自己的实现覆盖了默认的Nuxt路由器。如果我使用axios +异步导入路由router.addRoutes(),则似乎会丢失服务器端渲染。似乎createRouter将有异步支持,但尚未在Nuxt的正式版本中提供。

如何导入一个js / JSON文件同步到我的router.js下面,这样我就可以填充路线?我希望能够在运行时配置路由,所以我不希望它成为捆绑软件的一部分。

modules / router.js:

const path = require('path')

module.exports = function () {
  this.nuxt.options.build.createRoutes = () => {}
  this.addTemplate({
    fileName: 'router.js',
    src: path.resolve(`${this.options.srcDir}`, 'router.js')
  })
}

nuxt.config.js:

modules: ['~/modules/router']

router.js:

import Vue from 'vue'
import Router from 'vue-router'

Vue.use(Router)

export function createRouter () {
  const router = new Router({
    mode: 'history',
    routes: [/* ... */]
  })

  return router
}
JinJinTom2020/03/24 17:34:00

您可以尝试使用sync-request

它是一个NPM软件包,旨在执行同步Web请求。在这里可用

请注意,如软件包本身的文档中所述,它不适用于生产环境,这可能是由于丢失数据导致应用程序挂起。