错误 app.default.object 不是函数

Error app.default.object is not a function

我是 react-native 的新手,我正在尝试帮助一个项目。我首先重构代码以获得更好的文件结构。我实现了桶并添加了路径别名(模块解析器)。 在 vscode 中一切正常,但是当我在 android 中 运行 时,它给了我这个错误:

TypeError:_app.default.objects is not a function. {...} _app.default.objects is undefined.

这是我的 tsconfig:

"baseUrl": ".",
    "paths": {
      "@assets/*": ["./app/assets/*"],
      "@components/*": ["./app/components/*"],
      "@components": ["./app/components"],
      "@containers/*": ["./app/containers/*"],
      "@db": ["./app/db"],
      "@db/*": ["./app/db/*"],
      "@languages/*": ["./app/languages/*"],
      "@navigation/*": ["./app/navigation/*"],
      "@styles/*": ["./app/styles/*"],
      "@services": ["./app/services"],
      "@services/*": ["./app/services/*"],
      "@utils": ["./app/utils"],
      "@utils/*": ["./app/utils/*"],
    }

还有我的 babel-config:

  plugins: [
    [
      'module-resolver',
      {
        root: ['./app'],
        extensions: ['.ios.js', '.android.js', '.js', '.json', '.ts', '.tsx'],
        alias: {
          '@languages': './app/languages',
          '@db': './app/db',
          '@styles': './app/styles',
          '@services': './app/services',
          '@utils': './app/utils',
          '@assets': './app/assets',
          '@navigation': './app/navigation',
          '@components': './app/components',
          '@containers': './app/containers',
        },
      },
    ],
  ]

每次使用数据库都会报错: 这是我的导入:

import { Song } from '@db'
import { GlobalSettings } from "@db/GlobalSettings";

如果我使用类似的东西:

const [songs, setSongs] = useState(Song.getAll())

但是 db 目录中的其他所有内容都是一样的。

谢谢!

经过长时间的调试,我发现是我的配置文件babel.config.js(或tsconfig.json,我不知道)的问题。

这是对我有用的:
tsconfig.json

{
  "compilerOptions": {
    ...,
    "baseUrl": "./app/",
    "paths": {
      "@assets/*": ["assets/*"],
      "@components/*": ["components/*"],
      "@components": ["components"],
      "@containers/*": ["containers/*"],
      "@containers": ["containers"],
      "@db/*": ["db/*"],
      "@db": ["db"],
      "@languages/*": ["languages/*"],
      "@languages": ["languages"],
      "@navigation/*": ["navigation/*"],
      "@navigation": ["navigation"],
      "@styles/*": ["styles/*"],
      "@styles": ["styles"],
      "@services/*": ["services/*"],
      "@services": ["services"],
      "@utils/*": ["utils/*"],
      "@utils": ["utils"],
    },
   ...
  },
...
}

babel.config.js

module.exports = {
  presets: ['module:metro-react-native-babel-preset'],
  plugins: [
    [
      'module-resolver',
      {
        root: ['./app'],
        alias: {
          '@languages': './app/languages',
          '@db': './app/db',
          '@styles': './app/styles',
          '@services': './app/services',
          '@utils': './app/utils',
          '@assets': './app/assets',
          '@navigation': './app/navigation',
          '@components': './app/components',
          '@containers': './app/containers',
        },
      },
    ],
  ],
};