Error: Expected content key de1e4a02ec63c4eb to exist getting this error in React. I am using parcel as a bundler

Question

While creating a react app from scratch (without using create-react-app) using parcel bundler, the parcel throws the following error:

  Error: Expected content key de1e4a02ec63c4eb to exist
      at nullthrows (F:\react\node_modules\nullthrows\nullthrows.js:7:15)
      at AssetGraph.getNodeIdByContentKey (F:\react\node_modules\@parcel\graph\lib\ContentGraph.js:67:38)
      at F:\react\node_modules\@parcel\core\lib\SymbolPropagation.js:52:82
      at Array.map (<anonymous>)
      at propagateSymbols (F:\react\node_modules\@parcel\core\lib\SymbolPropagation.js:52:61)
      at AssetGraphBuilder.build (F:\react\node_modules\@parcel\core\lib\requests\AssetGraphRequest.js:168:62)
      at async Object.run (F:\react\node_modules\@parcel\core\lib\requests\AssetGraphRequest.js:60:37)
      at async RequestTracker.runRequest (F:\react\node_modules\@parcel\core\lib\RequestTracker.js:633:20)
      at async Object.run (F:\react\node_modules\@parcel\core\lib\requests\BundleGraphRequest.js:103:11)
      at async RequestTracker.runRequest (F:\react\node_modules\@parcel\core\lib\RequestTracker.js:633:20)

How can I solve this?

The version of parcel is 2.9.3

I have tried deleting cache and also tried recreating the whole project but nothing happened.

Ailing

Please clarify your specific problem or provide additional details to highlight exactly what you need. As it's currently written, it's hard to tell exactly what you're asking. – Bunyan

Answer 1

If you are using parcel then try to delete .parcel-cache folder and then Rerun the build.

Trickle

This is an extremely lousy workaround, if you can call it that - it will not work when watch-ing for changes, for example. Apparently it is the "official way", seeing that it was reported on github but the developers didn't want to fix it (or improve the situation), which makes parcel a questionable choice... – Autoradiograph

Answer 2

Deleting .parcel-cache folder works fine.

Instead of every time deleting it manually, you can simply add rm -rf .parcel-cache && before your start, dev or build command in package.json.

package.json

{
  ...
  "scripts": {
    "start": "rm -rf .parcel-cache && parcel",
    "build": "rm -rf .parcel-cache && parcel build"
  }
  ...
}

Addieaddiego

Answer 3

Remove-Item -Recurse -Force .parcel-cache

when you run Remove-Item -Recurse -Force .parcel-cache, it will forcefully and recursively delete the .parcel-cache directory and all its contents. Use this command carefully, as it permanently removes the specified directory and its content. then run npx parcel <entry point(like index.html)>

Parma

Answer 4

You can also use npm cache clean && before npm Start and npm run build, this command is used to clear the Parcel cache.

Extempore

Answer 5

Add below in your package.json.

"scripts": 
{
    "start": "rm -rf .parcel-cache && parcel",
    "build": "rm -rf .parcel-cache && parcel build"
}

Then run npm cache clean --force and then finally you can run your script using npx parcel filename.html

Ceria

Answer 6

Remove-Item -Recurse -Force .parcel-cache

Use this in terminal, and it'll work. It deletes the cache which is causing the issue.

Asare

Repost of this answer. Please upvote the existing answer rather than adding more noise and maintenance burden to the thread. Thanks. – Crimp

Answer 7

If you are using parcel then try to delete ".parcel-cache" folder. And then Rerun the build.

Mastoiditis

Repost of this answer. Please upvote the existing answer rather than adding more noise and maintenance burden to the thread. Thanks. – Crimp

Answer 8

Firstly cancel the build (ctrl + c). Then delete "parcel-cache. then return the build (in terminal :- npx parcel index.html). then, if you import like this - import {ReactDOM} from 'react-dom' replace it with code below :- import ReactDOM from "react-dom"

Bristling

Basically the same as this answer but with some irrelevant information that probably only applies to your situation (the import problem, your OS-specific ctrl key). We can assume everyone here knows how to stop and rerun a program, so it doesn't require an additional answer to explain this. – Crimp