workbox icon indicating copy to clipboard operation
workbox copied to clipboard

"module" field: do not re-export "main" field

Open AprilArcus opened this issue 4 years ago • 2 comments
trafficstars

The packages workbox-cacheable-response, workbox-core, workbox-expiration, and workbox-strategies fail under jest with --experimental-vm-modules with this error:

    Jest encountered an unexpected token

    This usually means that you are trying to import a file which Jest cannot parse, e.g. it's not plain JavaScript.

    By default, if Jest sees a Babel config, it will use that to transform your files, ignoring "node_modules".

    Here's what you can do:
     • If you are trying to use ECMAScript Modules, see https://jestjs.io/docs/en/ecmascript-modules for how to enable it.
     • To have some of your "node_modules" files transformed, you can specify a custom "transformIgnorePatterns" in your config.
     • If you need a custom transformation specify a "transform" option in your config.
     • If you simply want to mock your non-JS modules (e.g. binary assets) you can stub them out with the "moduleNameMapper" config option.

    You'll find more details and examples of these config options in the docs:
    https://jestjs.io/docs/en/configuration.html

    Details:

    /Users/me/path/to/project/node_modules/workbox-strategies/index.js:8
    import { CacheFirst } from './CacheFirst.js';
    ^^^^^^

    SyntaxError: Cannot use import statement outside a module

      3 |   RouteMatchCallback,
      4 | } from 'workbox-core'
    > 5 | import { CacheFirst } from 'workbox-strategies'
        | ^
      6 | import { CacheableResponsePlugin } from 'workbox-cacheable-response'
      7 | import { ExpirationPlugin } from 'workbox-expiration'
      8 |

      at Runtime.createScriptFromCode (node_modules/jest-runtime/build/index.js:1350:14)
      at Object.<anonymous> (path/to/project/src/project_file.ts:L:C)

Investigating the package.json reveals that the "module" field points to index.mjs, which is correctly interpreted as a module, but that index.mjs in turn attempts to re-export items from index.js. Since index.js is pointed to by the "main" field, jest interprets this subsidiary dependency as a script rather than a module, and throws a syntax error.

AprilArcus avatar Jul 24 '21 00:07 AprilArcus

I am facing the same problem with workbox-expiration do you have an update for this, please? @jeffposnick

Hossam-Ali avatar Dec 08 '21 16:12 Hossam-Ali

I think we're going to re-evaluate how we ship our ES modules in Workbox v7 (see #2797) as a breaking change.

I don't think we're going to see any changes before that.

In general, I'm wary of customizing Workbox's published modules to accommodate Jest, as I've anecdotally heard about developer pain related to their current implementation: https://twitter.com/rauschma/status/1467279640301641728

jeffposnick avatar Dec 08 '21 16:12 jeffposnick