CODEWITHSUNDEEP
reactjswebpackbabeljscreate-react-app
pastacompany
pastacompany

Reputation: 165

You may need an additional loader to handle the result of these loaders error with CRA

I installed a package called "dids", which I believe contains another package "did-jwt" that is causing this error:

Module parse failed: Unexpected token (192:53)
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.
|     return t.find(e => {
|       const r = p(I(e));
>       return r === i || r === c || e.ethereumAddress?.toLowerCase() === u || e.blockchainAccountId?.split("@eip155")?.[0].toLowerCase() === u;
|     });
|   }).filter(e => null != e);

I started looking into webpack, babel, and what goes on behind CRA, since I saw the error was with loaders, babel, and webpack. I'd never looked into the toolchain before since I've only been using React for a bit. I have a better understanding of the problem, but am still confused why its happening, and how to solve it? I looked into running npm run eject but only wish to use that as a last resort.

My current understanding is that webpack compiles and bundles the JS code, and Babel transpiles the code to transform more modern JS into older JS so its understandable by older browsers. (feel free to correct me on this, my understanding still rusty). Webpack uses loaders while bundling and calls upon loaders to do certain thing, like babel to transpile. But in this case, why can babel not compile this piece of code?

I also saw this post: "You may need an additional loader to handle the result of these loaders."

Which explains that babel doesn't run on dependencies in the project, only the source code. But it seems that babel lis running on the did-jwt dependency?

Upvotes: 1

Views: 1155

Answers (1)

Stefan
Stefan

Reputation: 3402

Dor your very special case (did-jwt) you might be able to use an older release of did-jwt (just made it work on my machine with v5.1.0 for example). When did-jwt is a transitive dependency and you're using yarn, you could put this in your package.json:

  "resolutions": {
    "did-jwt": "5.1.0"
  },

Upvotes: 2

Related Questions