Puppeteer dependency installation issue

468 Views Asked by At

I am trying to install and learn about Puppeteer through the Puppeteer examples in the github. I am using MacOS 14.

I did this to install Puppeteer npm i puppeteer

There isn't any error during the Puppeteer installation though there is a warning: The package-lock.json file was created with an old version of npm, so supplemental metadata must be fetched from the registry.

I went on to clone the git repository

git clone https://github.com/puppeteer/examples.git

this has no error.

Then I cd to the examples directory (that is created by the git clone process) and run the command

npm i

There is a long list of error messages, upon examining them - here are those that are genuine. It seems to suggest my c++ compiler files / env are not working too well. I suspect it is not a Puppeteer issue but my own OS/xcode/nodeJS gyp issue, can someone help and give some pointers?

npm ERR! In file included from ../src/common.cc:22:
npm ERR! In file included from /Users/Thomas/Library/Caches/node-gyp/18.18.2/include/node/node.h:73:`
npm ERR! In file included from /Users/Thomas/Library/Caches/node-gyp/18.18.2/include/node/v8.h:24:
npm ERR! In file included from /Users/Thomas/Library/Caches/node-gyp/18.18.2/include/node/v8-array-buffer.h:12:
npm ERR! In file included from /Users/Thomas/Library/Caches/node-gyp/18.18.2/include/node/v8-local-handle.h:12:
npm ERR! /Users/Thomas/Library/Caches/node-gyp/18.18.2/include/node/v8-internal.h:646:50: error: 'T' does not refer to a value
npm ERR!             !std::is_same<Data, std::remove_cv_t<T>>::value>::Perform(data);
npm ERR!                                                  ^
npm ERR! /Users/Thomas/Library/Caches/node-gyp/18.18.2/include/node/v8-internal.h:643:17: note: declared here
npm ERR! template <class T>
npm ERR!                 ^
npm ERR! /Users/Thomas/Library/Caches/node-gyp/18.18.2/include/node/v8-internal.h:646:38: error: no member named 'remove_cv_t' in namespace 'std'; did you mean 'remove_if'?
npm ERR!             !std::is_same<Data, std::remove_cv_t<T>>::value>::Perform(data);
npm ERR!                                 ~~~~~^~~~~~~~~~~
npm ERR!                                      remove_if
npm ERR! /Applications/Xcode.app/Contents/Developer/Platforms/MacOSX.platform/Developer/SDKs/MacOSX.sdk/usr/include/c++/v1/__algorithm/remove_if.h:24:1: note: 'remove_if' declared here
npm ERR! remove_if(_ForwardIterator __first, _ForwardIterator __last, _Predicate __pred)
npm ERR! ^
npm ERR! In file included from ../src/common.cc:22:
npm ERR! In file included from /Users/Thomas/Library/Caches/node-gyp/18.18.2/include/node/node.h:73:
npm ERR! In file included from /Users/Thomas/Library/Caches/node-gyp/18.18.2/include/node/v8.h:24:
npm ERR! In file included from /Users/Thomas/Library/Caches/node-gyp/18.18.2/include/node/v8-array-buffer.h:12:
npm ERR! In file included from /Users/Thomas/Library/Caches/node-gyp/18.18.2/include/node/v8-local-handle.h:12:
npm ERR! /Users/Thomas/Library/Caches/node-gyp/18.18.2/include/node/v8-internal.h:646:52: error: expected '(' for function-style cast or type construction
npm ERR!             !std::is_same<Data, std::remove_cv_t<T>>::value>::Perform(data);
npm ERR!              ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~^
npm ERR! /Users/Thomas/Library/Caches/node-gyp/18.18.2/include/node/v8-internal.h:646:63: error: no member named 'Perform' in the global namespace
npm ERR!             !std::is_same<Data, std::remove_cv_t<T>>::value>::Perform(data);
npm ERR!                                                             ~~^
npm ERR! In file included from ../src/common.cc:24:
npm ERR! In file included from ../../nan/nan.h:222:
npm ERR! In file included from ../../nan/nan_converters.h:67:
npm ERR! ../../nan/nan_converters_43_inl.h:22:1: error: no viable conversion from 'Local<Context>' to 'Isolate *'
npm ERR! X(Boolean)
npm ERR! ^~~~~~~~~~
npm ERR! ../../nan/nan_converters_43_inl.h:18:23: note: expanded from macro 'X'
npm ERR!       val->To ## TYPE(isolate->GetCurrentContext())                            \
npm ERR!                       ^~~~~~~~~~~~~~~~~~~~~~~~~~~~
npm ERR! /Users/Thomas/Library/Caches/node-gyp/18.18.2/include/node/v8-value.h:398:37: note: passing argument to parameter 'isolate' here
npm ERR!   Local<Boolean> ToBoolean(Isolate* isolate) const;
npm ERR!                                     ^
npm ERR! In file included from ../src/common.cc:24:
npm ERR! In file included from ../../nan/nan.h:222:
npm ERR! In file included from ../../nan/nan_converters.h:67:
npm ERR! ../../nan/nan_converters_43_inl.h:22:1: error: no member named 'FromMaybe' in 'v8::Local<v8::Boolean>'
npm ERR! X(Boolean)
npm ERR! ^~~~~~~~~~
npm ERR! ../../nan/nan_converters_43_inl.h:19:12: note: expanded from macro 'X'
npm ERR!           .FromMaybe(v8::Local<v8::TYPE>()));                                  \
npm ERR!            ^
npm ERR! ../../nan/nan_converters_43_inl.h:40:1: error: no viable conversion from 'Local<Context>' to 'Isolate *'
npm ERR! X(bool, Boolean)
npm ERR! ^~~~~~~~~~~~~~~~
npm ERR! ../../nan/nan_converters_43_inl.h:37:29: note: expanded from macro 'X'
npm ERR!   return val->NAME ## Value(isolate->GetCurrentContext());                     \
npm ERR!                             ^~~~~~~~~~~~~~~~~~~~~~~~~~~~
npm ERR! /Users/Thomas/Library/Caches/node-gyp/18.18.2/include/node/v8-value.h:408:30: note: passing argument to parameter 'isolate' here
npm ERR!   bool BooleanValue(Isolate* isolate) const;
npm ERR!                              ^
npm ERR! In file included from ../src/common.cc:24:
npm ERR! In file included from ../../nan/nan.h:222:
npm ERR! In file included from ../../nan/nan_converters.h:67:
npm ERR! ../../nan/nan_converters_43_inl.h:40:1: error: no viable conversion from returned value of type 'bool' to function return type 'imp::ToFactory<bool>::return_t' (aka 'Maybe<bool>')
npm ERR! X(bool, Boolean)
npm ERR! ^~~~~~~~~~~~~~~~
npm ERR! ../../nan/nan_converters_43_inl.h:37:10: note: expanded from macro 'X'
npm ERR!   return val->NAME ## Value(isolate->GetCurrentContext());                     \
npm ERR!          ^~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
npm ERR! /Users/Thomas/Library/Caches/node-gyp/18.18.2/include/node/v8-maybe.h:29:7: note: candidate constructor (the implicit copy constructor) not viable: no known conversion from 'bool' to 'const v8::Maybe<bool> &' for 1st argument
npm ERR! class Maybe {
npm ERR!       ^
npm ERR! /Users/Thomas/Library/Caches/node-gyp/18.18.2/include/node/v8-maybe.h:29:7: note: candidate constructor (the implicit move constructor) not viable: no known conversion from 'bool' to 'v8::Maybe<bool> &&' for 1st argument
npm ERR! /Users/Thomas/Library/Caches/node-gyp/18.18.2/include/node/v8-maybe.h:84:12: note: explicit constructor is not a candidate
npm ERR!   explicit Maybe(const T& t) : has_value_(true), value_(t) {}
npm ERR!            ^
npm ERR! In file included from ../src/common.cc:24:
npm ERR! In file included from ../../nan/nan.h:223:
npm ERR! In file included from ../../nan/nan_new.h:189:
npm ERR! ../../nan/nan_implementation_12_inl.h:356:37: error: too few arguments to function call, expected 2, have 1
npm ERR!   return v8::StringObject::New(value).As<v8::StringObject>();
npm ERR!          ~~~~~~~~~~~~~~~~~~~~~      ^
npm ERR! /Users/Thomas/Library/Caches/node-gyp/18.18.2/include/node/v8-primitive-object.h:81:23: note: 'New' declared here
npm ERR!   static Local<Value> New(Isolate* isolate, Local<String> value);
npm ERR!                       ^
npm ERR! In file included from ../src/common.cc:24:
npm ERR! In file included from ../../nan/nan.h:2706:
npm ERR! ../../nan/nan_object_wrap.h:24:25: error: no member named 'IsNearDeath' in 'Nan::Persistent<v8::Object>'
npm ERR!     assert(persistent().IsNearDeath());
npm ERR!            ~~~~~~~~~~~~ ^
npm ERR! /Applications/Xcode.app/Contents/Developer/Platforms/MacOSX.platform/Developer/SDKs/MacOSX.sdk/usr/include/assert.h:99:25: note: expanded from macro 'assert'
npm ERR!     (__builtin_expect(!(e), 0) ? __assert_rtn(__func__, __ASSERT_FILE_NAME, __LINE__, #e) : (void)0)
npm ERR!                         ^
npm ERR! In file included from ../src/common.cc:24:
npm ERR! In file included from ../../nan/nan.h:2706:
npm ERR! ../../nan/nan_object_wrap.h:127:26: error: no member named 'IsNearDeath' in 'Nan::Persistent<v8::Object>'
npm ERR!     assert(wrap->handle_.IsNearDeath());
npm ERR!            ~~~~~~~~~~~~~ ^
npm ERR! /Applications/Xcode.app/Contents/Developer/Platforms/MacOSX.platform/Developer/SDKs/MacOSX.sdk/usr/include/assert.h:99:25: note: expanded from macro 'assert'
npm ERR!     (__builtin_expect(!(e), 0) ? __assert_rtn(__func__, __ASSERT_FILE_NAME, __LINE__, #e) : (void)0)
npm ERR!                         ^
npm ERR! In file included from ../src/common.cc:24:
npm ERR! In file included from ../../nan/nan.h:2802:
npm ERR! ../../nan/nan_typedarray_contents.h:34:43: error: no member named 'GetContents' in 'v8::ArrayBuffer'
npm ERR!       data   = static_cast<char*>(buffer->GetContents().Data()) + byte_offset;
npm ERR!                                   ~~~~~~~~^
npm ERR! In file included from ../src/common.cc:27:
npm ERR! ../src/common.h:78:20: error: no member named 'Handle' in namespace 'v8'
npm ERR!   bool HasAttr(v8::Handle<v8::Object> obj, std::string attr);
npm ERR!                ~~~~^
npm ERR! ../src/common.h:78:37: error: expected '(' for function-style cast or type construction
npm ERR!   bool HasAttr(v8::Handle<v8::Object> obj, std::string attr);
npm ERR!                           ~~~~~~~~~~^
npm ERR! ../src/common.h:78:39: error: use of undeclared identifier 'obj'
npm ERR!   bool HasAttr(v8::Handle<v8::Object> obj, std::string attr);
npm ERR!                                       ^
npm ERR! ../src/common.h:78:56: error: expected '(' for function-style cast or type construction
npm ERR!   bool HasAttr(v8::Handle<v8::Object> obj, std::string attr);
npm ERR!                                            ~~~~~~~~~~~ ^
npm ERR! ../src/common.h:79:29: error: no member named 'Handle' in namespace 'v8'
npm ERR!   std::string AttrAsStr(v8::Handle<v8::Object> obj, std::string attr);
npm ERR!                         ~~~~^
npm ERR! ../src/common.h:79:46: error: expected '(' for function-style cast or type construction
npm ERR!   std::string AttrAsStr(v8::Handle<v8::Object> obj, std::string attr);
npm ERR!                                    ~~~~~~~~~~^
npm ERR! ../src/common.h:79:48: error: use of undeclared identifier 'obj'
npm ERR!   std::string AttrAsStr(v8::Handle<v8::Object> obj, std::string attr);
npm ERR!                                                ^
npm ERR! fatal error: too many errors emitted, stopping now [-ferror-limit=]
npm ERR! 20 errors generated.
npm ERR! make: *** [Release/obj.target/sharp/src/common.o] Error 1
npm ERR! gyp ERR! build error 
npm ERR! gyp ERR! stack Error: `make` failed with exit code: 2
npm ERR! gyp ERR! stack     at ChildProcess.onExit (/usr/local/lib/node_modules/npm/node_modules/node-gyp/lib/build.js:203:23)
npm ERR! gyp ERR! stack     at ChildProcess.emit (node:events:517:28)
npm ERR! gyp ERR! stack     at ChildProcess._handle.onexit (node:internal/child_process:292:12)
npm ERR! gyp ERR! System Darwin 23.0.0
npm ERR! gyp ERR! command "/usr/local/bin/node" "/usr/local/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js" "rebuild"
npm ERR! gyp ERR! cwd /Users/Thomas/work/puppeteer/examples/node_modules/sharp
npm ERR! gyp ERR! node -v v18.18.2
npm ERR! gyp ERR! node-gyp -v v9.4.0
npm ERR! gyp ERR! not ok 
2

There are 2 best solutions below

0
On

If you've updated npm and reinstalled Puppeteer but still encounter errors after running 'npm i,' here are some additional steps to address the issue. This step-by-step process should help you address any issues with npm and Puppeteer by resetting your installation.

  1. Delete 'node_modules' and 'package-lock.json' by: rm -rf node_modules rm package-lock.json

  2. Clear npm cache: Clearing the npm cache can resolve various issues. Run: npm cache clean -f

  3. Update your project dependencies: Run 'npm i' again to reinstall all the project dependencies. Make sure you are in the project directory: npm install

  4. Check for Errors: After running 'npm install,' pay close attention to any error messages or warnings. They may point to specific issues in your project configuration or dependencies.

  5. Manually Install Dependencies: If errors persist, consider manually installing Puppeteer and other dependencies one by one: npm install puppeteer

1
On

The warning you were given "The package-lock.json file was created with an old version of npm, so supplemental metadata must be fetched from the registry." is exactly the reason for the errors you are experiencing as supplemental metadata must be fetched from the registry manually. So This means that you have to manage the dependencies without the help of npm.

This warning is letting you know there may be problems in dependency management and so the answer is to update npm by: npm update -g