typescript - lerna + yarn ワークスペース monorepo 内で jest + 酵素を構成する方法

Question

Lerna + yarn ワークスペースのモノレポをセットアップしようとしています。パッケージを構成して正常にビルドしましたが、テスト環境をセットアップするのに多くの問題があります。

プロジェクト内では、webpack、babel、typescript を使用しています。テストには jest、babel-jest、enzyme を使用したいと考えています。

酵素jestを含むテストを実行しようとすると、「Jest が予期しないトークンに遭遇しました」というエラーが表示され、次の詳細が表示されます。

monorepo/packages/core/src/setupEnzyme.ts:1

({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,global,jest){import { configure } from "enzyme";
                                                                                                    ^

    SyntaxError: Unexpected token {

      at ScriptTransformer._transformAndBuildScript (../../node_modules/@jest/transform/build/ScriptTransformer.js:537:17)
      at ScriptTransformer.transform (../../node_modules/@jest/transform/build/ScriptTransformer.js:579:25)
          at Array.forEach (<anonymous>)```

私のコンポーネント:

monorepo/packages/core/src/button/button.tsx

import { Box, Button as MuiButton } from "@material-ui/core"
import * as React from "react"


export function Button() {
  return (
    <Box>
      <MuiButton>Im a button</MuiButton>
    </Box>
  )
}

私のテスト

monorepo/packages/core/src/button/button.test.tsx

import { mount } from "enzyme"
import * as React from "react"

import { Button } from "./button"

describe("Button Component", () => {
  it("renders", () => {
    const wrapper = mount(<Button />)
    expect(wrapper).toMatchSnapshot()
  })
})

酵素セットアップ:

monorepo/packages/core/src/setupEnzyme.ts

import { configure } from "enzyme"
import Adapter from "enzyme-adapter-react-16"

configure({ adapter: new Adapter() })

ジェスト構成:

monorepo/packages/core/jest.config.js

module.exports = {
  transform: {
    "^.+\\.(ts|tsx)$": "babel-jest",
  },
  snapshotSerializers: ["enzyme-to-json/serializer"],
  setupFilesAfterEnv: ["<rootDir>/src/setupEnzyme.ts"],
}

バベルの設定:

monorepo/packages/core/babel.config.js

module.exports = {
  ignore: ["**/*.spec.ts", "**/*.test.ts", "**/*.test.tsx"],
  sourceMaps: "inline",
  presets: [
    [
      "@babel/preset-env",
      {
        targets: "> 0.25%, not dead",
        corejs: "3",
        useBuiltIns: "entry",
        modules: "false",
      },
    ],
    "@babel/preset-react",
    "@babel/typescript",
  ],
  plugins: [
    [
      "babel-plugin-module-resolver",
      {
        root: ["./"],
        alias: {
          src: "./src",
          "@core": "./src",
        },
      },
    ],
  ],
}

tsconfig:

monorepo/tsgonfig.json

{
  "compilerOptions": {
    "target": "es6",
    "lib": ["dom", "dom.iterable", "esnext"],
    "skipLibCheck": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "strict": true,
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "noEmit": true,
    "jsx": "react",
    "baseUrl": "./",
    "paths": {
      "@core/*": ["packages/core/src/*"],
      "@portal/*": ["packages/portal/src/*"],
      "@homepage/*": ["packages/homepage-designer/src/*"]
    }
  },
  "include": [
    "packages/core/src/index.ts",
    "packages/portal/src/index.tsx",
    "packages/homepage-designer/src/index.tsx",
    "packages/core/src/**/*.test.tsx",
    "packages/portal/src/**/*.test.tsx",
  ],
  "exclude": ["**/node_modules"]
}

コア Package.json:

monorepo/packages/core/package.json

{
  "name": "@person/core",
  "version": "1.0.0",
  "main": "dist/index.js",
  "typings": "src/index.d.ts",
  "license": "MIT",
  "scripts": {
    "test": "jest",
    "bootstrap": "lerna bootstrap --use-workspaces",
    "build": "rm -rf ./dist && babel src --out-dir ./dist --extensions '.ts,.tsx' --config-file ./babel.config.js --ignore 'src/setupEnzyme.ts'"
  }
}

ルート Package.json:

モノレポ/モノレポ/package.json

{
  "name": "@person/monorepo",
  "private": true,
  "workspaces": [
    "packages/*"
  ],
  "devDependencies": {
    "@babel/cli": "^7.7.4",
    "@babel/core": "^7.7.4",
    "@babel/preset-env": "^7.7.4",
    "@babel/preset-react": "^7.7.4",
    "@babel/preset-typescript": "^7.7.4",
    "@types/enzyme": "^3.10.3",
    "@types/jest": "^24.0.23",
    "babel-core": "7.0.0-bridge.0",
    "babel-jest": "^24.9.0",
    "babel-loader": "^8.0.6",
    "babel-plugin-module-resolver": "^3.2.0",
    "babel-plugin-styled-components": "^1.10.6",
    "enzyme": "^3.10.0",
    "enzyme-adapter-react-16": "^1.15.1",
    "enzyme-to-json": "^3.4.3",
    "html-webpack-plugin": "^3.2.0",
    "jest": "^24.9.0",
    "lerna": "^3.19.0",
    "react": "^16.12.0",
    "react-dom": "^16.12.0",
    "source-map-loader": "^0.2.4",
    "styled-components": "^4.4.1",
    "ts-jest": "^24.2.0",
    "typescript": "^3.7.3",
    "webpack": "^4.41.2",
    "webpack-cli": "^3.3.7",
    "webpack-dev-server": "^3.8.0",
    "@types/react-dom": "^16.9.4"
  },
  "dependencies": {
    "@material-ui/core": "^4.7.1"
  }
}

私の質問は、酵素テストのセットアップのどこで間違ったのでしょうか?