quasar icon indicating copy to clipboard operation
quasar copied to clipboard
verified publisher icon quasarframework

Cannot install icongenie

Open vanngoh opened this issue 1 year ago • 6 comments

What happened?

First of all, I truly love the UX provided by icongenie, that's really genius! But currently I encounter the following error when I run the npm i -g @quasar/icongenie on my new Macbook Air(M3 chip).

npm WARN deprecated [email protected]: Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.
npm WARN deprecated @hapi/[email protected]: Moved to 'npm install @sideway/formula'
npm WARN deprecated @hapi/[email protected]: Moved to 'npm install @sideway/address'
npm WARN deprecated [email protected]: Please upgrade  to version 7 or higher.  Older versions may use Math.random() in certain circumstances, which is known to be problematic.  See https://v8.dev/blog/math-random for details.
npm WARN deprecated @hapi/[email protected]: Switch to 'npm install joi'
npm ERR! code 1
npm ERR! path /Users/xxx/.nvm/versions/node/v20.12.2/lib/node_modules/@quasar/icongenie/node_modules/pngquant-bin
npm ERR! command failed
npm ERR! command sh -c node lib/install.js
npm ERR! compiling from source
npm ERR! spawn Unknown system error -86
npm ERR! pngquant pre-build test failed
npm ERR! Error: pngquant failed to build, make sure that libpng is installed
npm ERR!     at /Users/xxx/.nvm/versions/node/v20.12.2/lib/node_modules/@quasar/icongenie/node_modules/bin-build/node_modules/execa/index.js:231:11
npm ERR!     at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
npm ERR!     at async Promise.all (index 0)

What did you expect to happen?

icongenie should be downloaded successfully but now it's not.

Reproduction URL

https://codepen.io/rstoenescu/pen/xxEvBLR?editors=1111

How to reproduce?

  1. Open Terminal
  2. Run node -v (make sure it's stable version)
  3. Run npm -v (make sure it's >10.0.0)
  4. Run npm i -g @quasar/icongenie (ERROR)

Flavour

Quasar CLI with Vite (@quasar/cli | @quasar/app-vite)

Areas

Icon Genie CLI (@quasar/icongenie)

Platforms/Browsers

No response

Quasar info output

Operating System - Darwin(23.4.0) - darwin/arm64
NodeJs - 20.12.2

Global packages
  NPM - 10.5.0
  yarn - 1.22.22
  @quasar/cli - 2.4.0
  @quasar/icongenie - Not installed
  cordova - Not installed

Important local packages
  quasar - 2.16.9 -- Build high-performance VueJS user interfaces (SPA, PWA, SSR, Mobile and Desktop) in record time
  @quasar/app-vite - 1.9.5 -- Quasar Framework App CLI with Vite
  @quasar/extras - 1.16.12 -- Quasar Framework fonts, icons and animations
  eslint-plugin-quasar - Not installed
  vue - 3.4.38 -- The progressive JavaScript framework for building modern web UI.
  vue-router - 4.4.3
  pinia - 2.2.2 -- Intuitive, type safe and flexible Store for Vue
  vuex - Not installed
  vite - 2.9.18 -- Native-ESM powered web dev build tool
  eslint - Not installed
  electron - Not installed
  electron-packager - Not installed
  @electron/packager - Not installed
  electron-builder - Not installed
  register-service-worker - 1.7.2 -- Script for registering service worker, with hooks
  @capacitor/core - Not installed
  @capacitor/cli - Not installed
  @capacitor/android - Not installed
  @capacitor/ios - Not installed

Quasar App Extensions
  *None installed*

Relevant log output

npm WARN deprecated [email protected]: Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.
npm WARN deprecated @hapi/[email protected]: Moved to 'npm install @sideway/formula'
npm WARN deprecated @hapi/[email protected]: Moved to 'npm install @sideway/address'
npm WARN deprecated [email protected]: Please upgrade  to version 7 or higher.  Older versions may use Math.random() in certain circumstances, which is known to be problematic.  See https://v8.dev/blog/math-random for details.
npm WARN deprecated @hapi/[email protected]: Switch to 'npm install joi'
npm ERR! code 1
npm ERR! path /Users/xxx/.nvm/versions/node/v20.12.2/lib/node_modules/@quasar/icongenie/node_modules/pngquant-bin
npm ERR! command failed
npm ERR! command sh -c node lib/install.js
npm ERR! compiling from source
npm ERR! spawn Unknown system error -86
npm ERR! pngquant pre-build test failed
npm ERR! Error: pngquant failed to build, make sure that libpng is installed
npm ERR!     at /Users/xxx/.nvm/versions/node/v20.12.2/lib/node_modules/@quasar/icongenie/node_modules/bin-build/node_modules/execa/index.js:231:11
npm ERR!     at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
npm ERR!     at async Promise.all (index 0)

Additional context

No response

vanngoh avatar Aug 25 '24 16:08 vanngoh

Since you say it's a new device, I suspect you might not have installed the XCode command line tools, which contain various stuff ranging from tools like git to libraries like libpng. Run the following command:

$ xcode-select --install

yusufkandemir avatar Aug 26 '24 14:08 yusufkandemir

Thanks for your reply, but unfortunately I think I have already installed.

$ xcode-select --install
xcode-select: note: Command line tools are already installed. Use "Software Update" in System Settings or the softwareupdate command line interface to install updates

vanngoh avatar Aug 26 '24 15:08 vanngoh

Then, please install libpng to your system. If you are using Homebrew, you can use brew install libpng. If that works, we will update the documentation accordingly. Thanks.

yusufkandemir avatar Aug 26 '24 15:08 yusufkandemir

Hello @yusufkandemir. I am running into this same issue on a new M4 MacBook Pro. I installed libpng via Homebrew, but I still get the following error. I didn't see anything specific in the docs for silicon Macs. Any ideas?

@vanngoh did you find a solution?

node:internal/process/promises:394
    triggerUncaughtException(err, true /* fromPromise */);
    ^

Error
    at ChildProcess._handle.onexit (node:internal/child_process:285:19)
    at onErrorNT (node:internal/child_process:483:16)
    at process.processTicksAndRejections (node:internal/process/task_queues:90:21) {
  errno: -2,
  code: 'ENOENT',
  syscall: 'spawn /xxx/node_modules/pngquant-bin/vendor/pngquant',
  path: '/xxx/node_modules/pngquant-bin/vendor/pngquant',
  spawnargs: [ '-', '--speed', 7, '--quality', '60-80' ],
  originalMessage: 'spawn /xxx/node_modules/pngquant-bin/vendor/pngquant ENOENT',
  shortMessage: 'Command failed with ENOENT: /xxx/node_modules/pngquant-bin/vendor/pngquant - --speed 7 --quality 60-80\n' +
    'spawn /xxx/node_modules/pngquant-bin/vendor/pngquant ENOENT',
  command: '/xxx/node_modules/pngquant-bin/vendor/pngquant - --speed 7 --quality 60-80',
  exitCode: undefined,
  signal: undefined,
  signalDescription: undefined,
  stdout: Buffer(0) [Uint8Array] [],
  stderr: Buffer(0) [Uint8Array] [],
  failed: true,
  timedOut: false,
  isCanceled: false,
  killed: false
}

Node.js v22.15.0

dreysolano avatar May 09 '25 22:05 dreysolano

@dreysolano if you are using pnpm 10, you have to use --allow-build like this:

$ pnpm --allow-build=sharp --allow-build=pngquant-bin dlx @quasar/icongenie

If not, please provide more information: which commands you used to set things up, which command did you use to run icongenie, etc.

yusufkandemir avatar May 10 '25 11:05 yusufkandemir

I have the same error.

I have libpng installed (confirmed by brew info libpng)

npm error Error: pngquant failed to build, make sure that libpng is installed
npm error     at /Users/moon/.nvm/versions/node/v22.19.0/lib/node_modules/@quasar/icongenie/node_modules/bin-build/node_modules/execa/index.js:231:11
npm error     at process.processTicksAndRejections (node:internal/process/task_queues:105:5)
npm error     at async Promise.all (index 0)
npm error A complete log of this run can be found in: /Users/moon/.npm/_logs/2025-09-26T05_04_04_243Z-debug-0.log

kwarnkham avatar Sep 26 '25 05:09 kwarnkham