Search code examples
node.jsmoduleparceljs

Can someone help me understand and solve this "Failed to install @parcel/transformer-image"? (JS)


I've been trying and failing repeatedly to install this parcel module and because of it I can't show images. I'm new to both using JS and using parcel and english is not my native language, so please ask for some patience here.

The error that appears is

Failed to install @parcel/transformer-image: npm failed to install modules: Unexpected token > in JSON at position 1

I've tried numerous solutions:

  • I've tried to uninstall and reinstall only the parcel/transformer-image module
  • I've already tried uninstalling and reinstalling the entire parcel
  • I've already tried uninstalling and reinstalling node-js and npm
  • I've already tried to install node through node manager nodist, but I ran into another error

At first, the build didn't work, but when I deactivated and activated the parcel again, it worked, but without loading the images. At this the moment the error doesn't appear anymore, but the image still doesn't load (and I inspected the element and saw that the link where the image should be loaded is correct).

After installing nodist and even after uninstalling it I'm having problems installing the parcel, but I managed it anyway.


Solution

  • This is how I solved it. There were two issues I needed to resolve:

    1. "npm install parcel" in any form/version did not work. After consulting Parcel's install guide they recommend installing parcel-bundler NOT parcel:
    npm install parcel-bundler --save-dev
    

    SOURCE: https://parceljs.org/getting_started.html

    1. Once installed, I immediately ran into an error - Uncaught ReferenceError: regeneratorRuntime is not defined - when doing the first async/await function.

    To solve this I had to add the code below for "browserslist" to package.json

    {
        "name": "my-app",
        ...
        "browserslist": [
            "last 1 Chrome versions"
        ],
        ...
    }
    

    SOURCE: https://github.com/parcel-bundler/parcel/issues/2128

    package.json settings shown in the pic attached.

    enter image description here