Getting pngquant error when I try to install Laravel on cPanel

Question

I have little experience with cPanel but I am required to setup a Laravel application on cpanel. I am really struggling to solve this problem.

Here are the steps I am taking:

1. Git Checkout the repository
2. Setup the .env
3. composer install
4. composer update
5. chmod -R 775 storage & chmod 775 bootstrap/cache
6. npm install -g npm bower yarn
7. yarn install
8. bower install
9. npm run dev
10. php artisan migrate:fresh --seed

(The reason for all the steps is because I am setting up a theme that I purchased, which works great everywhere except cPanel.)

The problem I am running into is when I try to install npm.

When I run npm install I get the following error:

> [email protected] postinstall /public_html/src/node_modules/pngquant-bin
> node lib/install.js

  ⚠ The `/public_html/src/node_modules/pngquant-bin/vendor/pngquant` binary doesn't seem to work correctly
  ⚠ pngquant pre-build test failed
  ℹ compiling from source
  ✖ Error: pngquant failed to build, make sure that libpng-dev is installed
    at ChildProcess.exithandler (child_process.js:294:12)
    at ChildProcess.emit (events.js:189:13)
    at maybeClose (internal/child_process.js:970:16)
    at Process.ChildProcess._handle.onexit (internal/child_process.js:259:5)

I tried various resources:

https://github.com/imagemin/pngquant-bin/issues/78

https://github.com/papandreou/node-pngquant/issues/14

I can tell you that pngquant is installed (tried directly from git and npm installing it) Still same error.

libpng-dev is installed (i think):

identify -list format | grep PNG

  JNG* PNG       rw-   JPEG Network Graphics
  MNG* PNG       rw+   Multiple-image Network Graphics (libpng 1.2.46,1.2.49)
  PNG* PNG       rw-   Portable Network Graphics (libpng 1.2.46,1.2.49)
       See http://www.libpng.org/ for details about the PNG format.
PNG24* PNG       rw-   opaque 24-bit RGB (zlib 1.2.3)
PNG32* PNG       rw-   opaque or transparent 32-bit RGBA
 PNG8* PNG       rw-   8-bit indexed with optional binary transparency

I've tried this:

npm install [email protected] --save
npm install [email protected]

Still get the same error

[~/public_html/src]# npm install [email protected] --save

> [email protected] postinstall /public_html/src/node_modules/pngquant-bin
> node lib/install.js

  ⚠ The `/public_html/src/node_modules/pngquant-bin/vendor/pngquant` binary doesn't seem to work correctly
  ⚠ pngquant pre-build test failed
  ℹ compiling from source
  ✖ Error: pngquant failed to build, make sure that libpng-dev is installed
    at ChildProcess.exithandler (child_process.js:294:12)
    at ChildProcess.emit (events.js:189:13)
    at maybeClose (internal/child_process.js:970:16)
    at Socket.stream.socket.on (internal/child_process.js:389:11)
    at Socket.emit (events.js:189:13)
    at Pipe._handle.close (net.js:597:12)

I also tried adding this to package.json

"resolutions": {
    "image-webpack-loader/imagemin-pngquant": "5.0.1"
  }

My node and npm versions are:

node -v v10.15.3

npm -v 6.9.0

Lastly, here's what my bin folder looks like:

[~/bin]# ls
./   bower@  node_modules/  npm-cli.js@  pngquant@  yarn.lock
../  node*   npm@           npx@         yarn@      yarnpkg@

To me it looks like pngquant is installed correctly but for some reason it isn't finding libpng-dev? Thoughts? help?! please help.

Answer 1

Firstly make sure you definitely have libpng-dev and not just libpng

dpkg -l libpng-dev

If not thing is returned then you don't have it so install it, you also need the essentials package so make sure you have that also:

sudo apt install build-essential libpng-dev

After doing this you will most likely need to remove the node_modules folder

rm -rf node_modules

Then run npm install again.