Error: Module parse failed: Unexpected token

[MshHooman]

Hi,

I'm trying to use the package but faced this error when I want to start the project.

important dependencies:

"@babel/core": "7.12.3",
"@lukemorales/query-key-factory": "^1.1.0",
"react": "^17.0.1",
"react-dom": "^17.0.1",
"@tanstack/react-query": "^4.24.4",
"webpack": "4.44.2",

plus that the project is ejected from CRA.

source code:

import { createQueryKeys } from '@lukemorales/query-key-factory';
export const usersKeys = createQueryKeys('users');

Error:

./node_modules/@lukemorales/query-key-factory/dist/index.mjs 67:37
Module parse failed: Unexpected token (67:37)
File was processed with these loaders:
 * ./node_modules/babel-loader/lib/index.js
You may need an additional loader to handle the result of these loaders.
|         } : void 0)
|       },
>           a = [...n, ...(r.queryKey ?? [])],
|           y = {
|         queryKey: a,

do you have any idea about what loader should I import or what makes this problem?

[lukemorales]

@MshHooman it seems that it's not being able to compile the ?? operator? If that's really the case, you can try to use this loader: https://babeljs.io/docs/babel-plugin-proposal-nullish-coalescing-operator

[gbyesiltas]

I have the same issue on Nuxt 2, error points to the same line. I tried adding the babel plugin but may not be doing it correctly because it didn't work. I'll try to figure it out and update you guys here

Update: could be related to the nuxt issue: https://github.com/nuxt/nuxt/issues/6688

Update 2: indeed, using the solution from the aforementioned nuxt issue worked for me. I needed to add the following to nuxt.config

build: {
// ... 
extend(config, _) {
      // transpile .mjs too (see: https://github.com/nuxt/nuxt/issues/6688)
      const babelRule = config.module.rules.find(
        (rule) => `${rule.test}` === "/\\.jsx?$/i"
      );
      if (babelRule) {
        babelRule.test = /\.m?jsx?$/i;
      }
    },
    transpile: [({ isLegacy }) => isLegacy && "@lukemorales/query-key-factory"],
}

[lukemorales]

@gbyesiltas thanks for sharing the fix!