Получил «Неожиданный токен, ожидаемая ошибка» в Webpack5 + babel при импорте @hookform/resolvers.

Question

Я пытаюсь импортировать@hookform/resolversпакет в моем приложении, и я использую

      import { superstructResolver } from '@hookform/resolvers/superstruct';

импортировать преобразователь.

Как только я запускаю приложение, я получаю следующую ошибку:

      
ERROR in ./node_modules/@hookform/resolvers/superstruct/src/superstruct.ts 7:31
Module parse failed: Unexpected token (7:31)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
| import { Resolver } from './types';
|
> const parseErrorSchema = (error: StructError) =>
|   error.failures().reduce<Record<string, FieldError>>(
|     (previous, error) =>
 @ ./node_modules/@hookform/resolvers/superstruct/dist/superstruct.module.js 1:50-89 1:140-141
 @ ./src/components/routes/create-environment/index.tsx 9:0-70 24:14-33
 @ ./src/components/app-router/index.tsx 6:0-79 76:33-55
 @ ./src/app.tsx 6:0-51 28:36-45

(Это странно, так как я не знаю, почему webpack пытается транспилировать/srcпапка здесь). Я думаю, это потому, что файл записи библиотеки находится в TS. поэтому я внес некоторые изменения в webpack.config.js:

      ...
{
        test: /\.tsx?|\.jsx?$/,
        loader: 'babel-loader',
        include: [
          path.resolve(__dirname, 'src'),
          // deps that need transpilation
          ...['@hookform'].map((d) =>
            path.resolve(__dirname, 'node_modules', d)
          ),
        ],
      },
...

Но теперь я получил ошибку:

      ERROR in ./node_modules/@hookform/resolvers/superstruct/src/superstruct.ts
Module build failed (from ./node_modules/babel-loader/lib/index.js):
SyntaxError: ./node_modules/@hookform/resolvers/superstruct/src/superstruct.ts: Unexpected token, expected "," (7:31)

   5 | import { Resolver } from './types';
   6 |
>  7 | const parseErrorSchema = (error: StructError) =>
     |                                ^
   8 |   error.failures().reduce<Record<string, FieldError>>(
   9 |     (previous, error) =>
  10 |       (previous[error.path.join('.')] = {
....

Похоже, что Babel не транспилирует этот файл в javascript. Но я уже добавляю @babel/preset-typescript в.babelrc:

      {
  "presets": [
    "@babel/preset-env",
    ['@babel/preset-react', {runtime: 'automatic'}],
    "@babel/preset-typescript"
  ],
  "plugins": [
    "@babel/plugin-proposal-class-properties",
    "babel-plugin-jsx-remove-data-test-id"
  ]
}

я тоже пробовал

      import { superstructResolver } from '@hookform/resolvers/superstruct/dist/superstruct';

Но это не помощь.

Так может ли кто-нибудь помочь мне понять:

1. почему webpack пытается транспилировать@hookform/resolvers/superstruct/src/superstruct.tsа не файл dist в пакете?
2. почему babel не транспилирует этот файл, когда я включаю путь вmodule.rules?

Обновление: удалить@hookform/resolvers/superstruct/srcпапка на самом деле заставила транспайл работать, но здесь это кажется не очень хорошей идеей.