Question

我正在创建新的质量检查问题，以分享我的发现，因为我遇到了与SO中已经讨论过的错误相同的错误，但是我的问题在其他地方。参考：Jest: TypeError: Cannot read property of undefined

我收到错误“ TypeError：无法读取未定义的属性'apiUrl'”。我不知道为什么。我已经设置了esModuleInterop和allowSyntheticDefaultImports tsconfig.json，所以我认为支持所有导出类型。

服务使用者发生错误

import Axios from 'axios';
import config from '@/services/config.service';

const axios = Axios.create({
  baseURL: config.apiUrl || undefined,
                  ^^^^^^
  ...
});

其中config服务导出了const config，甚至也默认导出了

export let config: AppConfig;

...

config = {...}

...

export default config;

我的tsconfig.json

{
  "compilerOptions": {
    "target": "esnext",
    "module": "esnext",
    "strict": true,
    "jsx": "preserve",
    "importHelpers": true,
    "moduleResolution": "node",
    "experimentalDecorators": true,
    "resolveJsonModule": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "sourceMap": true,
    "baseUrl": ".",
    "types": ["node", "webpack-env", "jest", "googlemaps"],
    "paths": {
      "@/*": ["src/*"],
    },
    "lib": ["esnext", "dom", "dom.iterable", "scripthost"],
    "skipLibCheck": true
  },
  "include": [
    "src/main.ts",
    "src/types/**/*",
    "src/WS_UIkit/src/types/**/*"
  ],
  "exclude": ["node_modules"]
}

我的jest.config.js

module.exports = {
  preset: '@vue/cli-plugin-unit-jest/presets/typescript-and-babel',
  // testMatch: ['**/*.spec.[jt]s?(x)],'
  testMatch: ['**/*.spec.ts'],
  moduleNameMapper: {
    // FIXES Could not locate module @/types mapped as: .../cart/src/types.
    '^@/types$': '<rootDir>/src/types/index.d',
  },
  transformIgnorePatterns: ['node_modules/(?!(quasar|quasar/*))'],
};

我的babel配置

module.exports = {
  presets: ['@vue/app'],
  plugins: [
    [
      'transform-imports',
      {
        quasar: {
          transform: 'quasar/dist/babel-transforms/imports.js',
          preventFullImport: true,
        },
      },
    ],
  ],
};

Answer 1

我的问题是我已经导出了未初始化的常量导出let config: AppConfig;，然后稍后对其进行了初始化config = {...}，因此在导出时为undefined。但这对我来说是一个谜，为什么它可以在应用程序中正常运行而没有错误，也许它执行代码然后解决导出问题？和开玩笑相反吗？为什么不同？是不是使用了相同的ts编译器？至少这个问题为我解决了。

开玩笑：TypeError：无法读取未定义的属性'foo'

1 个答案: