Webpack 3 и файлы .cjs/.mjs

Question

Контекст

Наш продукт (к сожалению) все еще находится на Webpack 3. Надеюсь на обновление, но пока я пытаюсь использовать библиотеку npm, которая объединяет cjs, mjs и iffeфайлы. (См. Отрывок из package.json ниже).

Проблема в том, что Webpack жалуется, когда я импортирую из этих файлов.

      import { styled } from '@stitches/react';

Это вызывает следующую ошибку:

      ERROR in ./node_modules/@stitches/react/dist/index.cjs
Module parse failed: Unexpected token (1:9356)
You may need an appropriate loader to handle this file type.

Неожиданный токен - это что-то случайное, например nили имя переменной. Исходный код широко используется в сообществе, поэтому, скорее всего, это не ошибка в коде.

Работает при копировании кода в src

В нашей настройке Babel мы ничего не трогаем в node_modules, но когда я копирую содержимое dist/index.cjs или dist/index.mjs в наш src каталог и импортируйте его туда, все работает нормально.

Мне кажется, что в исходном коде есть проблемы: а) как он импортируется как модуль, или б) для работы с нашей настройкой требуется какая-то транспиляция.

Вопрос

Это как-то связано с Webpack 3? Есть ли проблемы с файлами mjs и cjs?

package.json

      
{
  "name": "@stitches/react",
  "version": "0.2.3",
  "description": "The modern CSS-in-JS library",
  "type": "module",
  "main": "dist/index.cjs",
  "module": "dist/index.mjs",
  "types": "types/index.d.ts",
  "typesVersions": {
    ">= 4.1": {
      "*": [
        "types/index.d.ts"
      ]
    }
  },
  "jsdelivr": "dist/index.iife.js",
  "unpkg": "dist/index.iife.js",
  "exports": {
    ".": {
      "require": "./dist/index.cjs",
      "import": "./dist/index.mjs",
      "types": "./types/index.d.ts"
    }
  },