Typescript + jest 无法在模块外部使用 import 语句

Oza*_*dul 5 reactjs jestjs ts-jest

我几乎搜索了谷歌中的每个主题,但看起来它随着配置和版本的变化而变化。

我在导入 ES6 时遇到问题。我做了我能做的一切,我检查了 ts-jest 和 jest github issues 以及整个 stackoverflow,但无法完成。也许我忘记了什么?我仍然收到此错误: SyntaxError: Cannot use import statement outside a module

我真的不知道还能做什么...

我的 babel.config.js

module.exports = api => {
    const isTest = api.env('test');
    // You can use isTest to determine what presets and plugins to use.

    return {
        presets: [
            [
                '@babel/preset-env',
                '@babel/preset-typescript',
                {
                    targets: {
                        node: 'current',
                    },
                },
            ],
        ],
        env: {
            test: {
                plugins: [
                    "transform-es2015-modules-commonjs"
                ]
            }
        }
    };
};
Run Code Online (Sandbox Code Playgroud)

笑话配置.js

module.exports = {
    preset: 'ts-jest',
    rootDir: "./",
    testEnvironment: "node",
    globals: {
        'ts-jest': {
            tsconfig: {
                jsx: 'react',
                isolatedModules: true
            },
        },
    },
    testPathIgnorePatterns: ['/dist', '<rootDir>/src/assets'],
    transform: {
        '^.+\\.ts?$': 'ts-jest',
    },
    moduleNameMapper: {
        "\\.(jpg|ico|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "<rootDir>/src/__mocks__/fileMock.js",
        "\\.(css|less)$": "<rootDir>/src/__mocks__/fileMock.js",
        "^@common(.*)$": "<rootDir>/src/common$1",
    },
    collectCoverage: true,
    verbose: true,

};
Run Code Online (Sandbox Code Playgroud)

我的包.json

{
  "name": "project",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@testing-library/jest-dom": "^5.11.4",
    "@testing-library/react": "^11.1.0",
    "@testing-library/user-event": "^12.1.10",
    "@types/jest": "^26.0.15",
    "@types/node": "^12.0.0",
    "@types/react": "^17.0.0",
    "@types/react-dom": "^17.0.0",
    "dayjs": "^1.10.7",
    "lodash": "^4.17.21",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "react-hot-loader": "^4.13.0",
    "react-scripts": "4.0.3",
    "react-select": "^5.1.0",
    "react-spinners": "^0.11.0",
    "sp-rest-proxy": "^3.1.1",
    "typescript": "^3.6.4",
    "web-vitals": "^1.0.1"
  },
  "scripts": {
    "serve": "node server.js",
    "start": "webpack-dev-server --mode development --open --hot",
    "build": "webpack --mode production",
    "test": "npx jest",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": [
      "react-app",
      "react-app/jest"
    ]
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  },
  "devDependencies": {
    "@babel/preset-env": "^7.16.0",
    "@babel/preset-react": "^7.16.0",
    "@babel/preset-typescript": "^7.16.0",
    "awesome-typescript-loader": "^5.2.1",
    "babel-core": "7.0.0-beta.3",
    "babel-jest": "^27.3.1",
    "babel-plugin-transform-es2015-modules-commonjs": "^6.26.2",
    "css-loader": "^3.2.0",
    "file-loader": "^6.2.0",
    "jest": "26.4.2",
    "react-test-renderer": "^17.0.2",
    "style-loader": "^1.0.0",
    "ts-jest": "26.3.0",
    "ts-loader": "^9.2.6",
    "webpack-cli": "^4.9.1",
    "webpack-dev-server": "^4.4.0"
  }
}
Run Code Online (Sandbox Code Playgroud)

最后是 tsconfig

{
    "compilerOptions": {
        "sourceMap": true,
        "noImplicitAny": false,
        "module": "commonjs",
        "target": "es5",
        "lib": [
            "es2015",
            "es2017",
            "ES6",
            "dom"
        ],
        "types": [
            "jest"
        ],
        "allowJs": true,
        "skipLibCheck": true,
        "esModuleInterop": true,
        "allowSyntheticDefaultImports": true,
        "strict": true,
        "forceConsistentCasingInFileNames": true,
        "resolveJsonModule": true,
        "isolatedModules": true,
        "noEmit": true,
        "jsx": "react",
        "baseUrl": "./",
        "paths": {
            "@common/*": [
                "src/common/*"
            ],
            "@components/*": [
                "src/components/*"
            ],
            "@webparts/*": [
                "src/WebParts/*"
            ],
        }
    },
    "include": [
        "src"
    ],
    "exclude": [
        "node_modules"
    ]
}```
Run Code Online (Sandbox Code Playgroud)