如何在nuxt.config中引用外部自定义函数？

问题原因与解决方法 #

你写的代码存在3个核心问题：

• routes方法内使用了await关键字，但函数没有声明为async，属于基础语法错误
• nuxt.config.js是构建阶段执行的配置文件，无法访问运行时通过插件注入到Vue实例上的$deliveryClient对象，你需要在配置文件中自行初始化对应的客户端实例
• 如果routeGenerator是你自己写的本地工具文件，导入路径要写相对路径，否则Node会默认去node_modules目录下查找对应模块，会导致导入失败

正确写法示例 #

// 自行引入delivery client初始化实例、以及本地的路由生成工具
import { deliveryClient } from './你的delivery client初始化文件路径'
// 注意本地文件要写对相对路径，比如./utils/routeGenerator.js
import { buildChildRoutes } from './routeGenerator'

export default {
  generate: {
    // 给routes方法加上async修饰符
    async routes() {
      const response = await deliveryClient
        .itemsFeedAll()                  
        .toPromise()
      // 如果buildChildRoutes是异步方法，前面再加await即可
      return buildChildRoutes(response)
    }
  }
}

这种将路由生成逻辑拆分到外部文件的写法是完全支持的，generate.routes本身就兼容异步函数返回值，只要处理好依赖引入和异步语法的问题就可以正常运行。

内容的提问来源于stack exchange，提问作者channel34