【问题标题】:Unable to import a module from another module in Nuxt无法从 Nuxt 中的另一个模块导入模块
【发布时间】:2021-08-27 08:28:14
【问题描述】:

在我的 nuxt 目录结构中,我有一个名为 modules 的文件夹,其中包含我的自定义模块。在此示例中,它将包含模块 foobar。在nuxt.config.js foo 中添加如下:

// nuxt.config.js
...
modules: [
  ...
  "~/modules/foo"
],
...

注意bar 没有作为模块添加。 当我尝试在foo 中导入bar

// foo/index.ts

import { bar } from '~/modules/bar';

export default function fooModule() {
  console.log(bar)
}
// bar/index.ts

const bar = 1
export { bar };

export default function barModule() {}

我得到Nuxt Fatal ErrorError: Cannot find module '~/modules/bar'。 在nuxt.config.js 中添加"~/modules/bar"modules 似乎没有什么区别。

关于如何防止这种情况的任何想法?

【问题讨论】:

    标签: typescript nuxt.js


    【解决方案1】:

    模块是在考虑 Nuxt 的情况下设计的,像 axios module 这样的东西将以这种方式添加到 nuxt.config.js

    export default {
      modules: ['@nuxtjs/axios']
    }
    

    您不能像这样将自己的代码转储到modules


    您可能正在这里寻找plugins

    【讨论】:

    • 我不确定我是否认为插件意味着将功能注入 Vue 上下文(最好我想使用脚本顶部的 import 语句导入 foobar)?我可能对插件的使用有误解,我看看这个,谢谢!
    • 是的,pluginsmodules 之间的区别一开始可能很难理解。同时,您还需要知道将其编写为插件会将其全局链接到项目。如果不需要,出于性能原因,请随意按组件/页面简单地导入它。 @DominiqueGarmier
    • 如果不在/plugins 中,您会将这些.ts 文件放在哪里?有最佳实践吗?据我了解,我可以将它们放在 /assets 中,但 documentation 表示它适用于图像、样式、字体等。
    • @DominiqueGarmier 通常,/utils/ 是一个不错的目录(位于项目的根目录),我就是这样做的,我之前与之共事的所有人都这样做。
    • 所以我把我所有的“utils”都移到了/utils。但问题依然存在。我在/modules 中有一个模块(需要在那里),它将一个插件注入到 Vue 上下文中。并从/utils 导入,显然在构建过程中不会退出。再次给我Error: Cannot find module '~/utils/...'
    猜你喜欢
    • 1970-01-01
    • 2019-08-08
    • 2019-07-03
    • 2020-05-18
    • 1970-01-01
    • 1970-01-01
    • 2020-11-15
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多