search

fabricjs / fabric.js

Javascript Canvas Library, SVG-to-Canvas (& canvas-to-SVG) Parser
http://fabricjs.com
Other
28.31k stars 3.46k forks source link

Can't install Fabric on Mac OS #5224

Closed incompletude closed 5 years ago

incompletude commented 5 years ago

Mac OS X 10.13.6 Node.js 8.11.3 NPM 5.6.0 MacPorts 2.5.3

port installed bzip2 @1.0.6_0 (active) cairo @1.14.12_0+quartz+x11 (active) db48 @4.8.30_4 (active) expat @2.2.6_1 (active) fontconfig @2.13.1_0 (active) freetype @2.9.1_0 (active) gdbm @1.16_0 (active) gettext @0.19.8.1_0 (active) glib2 @2.56.2_0+x11 (active) libedit @20170329-3.1_2 (active) libffi @3.2.1_0 (active) libiconv @1.15_0 (active) libpixman @0.34.0_0 (active) libpng @1.6.35_0 (active) libxml2 @2.9.7_0 (active) ncurses @6.1_0 (active) openssl @1.0.2p_0 (active) ossp-uuid @1.6.2_11+perl5_26 (active) pcre @8.42_0 (active) perl5.26 @5.26.2_1 (active) python2_select @0.0_2 (active) python27 @2.7.15_0 (active) python_select @0.3_7 (active) readline @7.0.005_0 (active) sqlite3 @3.24.0_1 (active) xorg-libpthread-stubs @0.4_0 (active) xorg-libX11 @1.6.6_1 (active) xorg-libXau @1.0.8_1 (active) xorg-libxcb @1.13_1+python27 (active) xorg-libXdmcp @1.1.2_1 (active) xorg-libXext @1.3.3_1 (active) xorg-xcb-proto @1.13_0+python27 (active) xorg-xcb-util @0.4.0_1 (active) xorg-xorgproto @2018.4_0 (active) xrender @0.9.10_1 (active) xz @5.2.4_0 (active) zlib @1.2.11_0 (active)

I'm trying to install fabric.js for client use through npm:

npm i fabric

> canvas@1.6.12 install /Users/someuser/Desktop/boilerplate 2/node_modules/canvas
> node-gyp rebuild

./util/has_lib.sh: line 31: pkg-config: command not found
gyp: Call to './util/has_lib.sh freetype' returned exit status 0 while in binding.gyp. while trying to load binding.gyp
incompletude commented 5 years ago

Besides cairo, node-canvas requires a few other packages.

port install pkgconfig cairo pango libpng jpeg giflib libsrvg

Please, fix the documentation.

Also, makes no sense to have all this config to use fabric as a client library.

asturur commented 5 years ago

I can't replicate the node-canvas documentation here. If node-canvas fails to install is ok to think a dev can look at node-canvas documentation.

node-canvas is an optional dependency and missing node-canvas do not break the installation. Please look at: https://github.com/fabricjs/fabricjs-webpack

there is a install going on without the additional libs and works.

incompletude commented 5 years ago

I'm not saying you should replicate the node-canvas install documentation (but you could), I'm saying "To install Fabric.js using npm, you must first manually install Cairo on your system. Cairo is a system library which powers node-canvas, which Fabric.js relies on.", is misleading, because it gives the impression that all that is required is Cairo, when node-canvas depends on a few other dependencies (depends on OS) that are necessary for a smooth install.

Something like "To install Fabric.js using npm, you must first manually install node-canvas dependencies." would be more helpful.

asturur commented 5 years ago

But is not true. That is true only if you want to use it with nodejs.

if fabricjs is a project dependency, the installation should trow warning but not fail

incompletude commented 5 years ago

I maintain that the documentation is not clear enough.

nickensoul commented 5 years ago

@asturur anyway, npm installation fails on macOS.

asturur commented 5 years ago

something new with mojave? i can install with high sierra.

nickensoul commented 5 years ago

something new with mojave? i can install with high sierra.

@asturur did you already installed something from this list pkgconfig cairo pango libpng jpeg giflib libsrvg? Or are you tried to install on "clean" system?

Actually, we are working with Electron application and cannot make build to work on other system without these modules installed.

Any help would be appreciated.

node-canvas is an optional dependency and missing node-canvas do not break the installation. Are you mean that fabric works without node-canvas installed? How can npm install proceed and install all other modules, if it fails on step during node-canvas installation via node-gyp?

I've read docs at node-canvas and it should provide pre-build on version 2, but are we really need node-canvas for fabric? Thanks!

asturur commented 5 years ago

Are you mean that fabric works without node-canvas installed? How can npm install proceed and install all other modules, if it fails on step during node-canvas installation via node-gyp?

It should proceed since those are marked as optionalDeps.

node-canvas for fabric is needed for testing and for working under node.

The PR that enable to work with canvas 2 is nearly done, is here: https://github.com/fabricjs/fabric.js/pull/5356

I m missing to fix some strange new crash/extra log that happens because of the changes in JSDOM and CANVAS2 interacting with my testing code.

@asturur did you already installed something from this list pkgconfig cairo pango libpng jpeg giflib libsrvg?

I installed all of them or node-canvas cannot work.

fabio984 commented 5 years ago

Hi, after installing canvas 1.6 and fabric I still have a problem running helloWorld tutorial.

running this code:

Screenshot 2019-03-12 at 10 55 26

I get this:

Screenshot 2019-03-12 at 10 55 43

the packageJson:

Screenshot 2019-03-12 at 11 33 04

seems a simple solution? Anyone? thanks in advance

######## EDIT: now the error is another one, same code:

Screenshot 2019-03-12 at 12 21 19
Olgagr commented 5 years ago

if fabricjs is a project dependency, the installation should trow warning but not fail

@asturur Can you make it more clear? npm is right now used for dependency managment in node.js and client side projects. When I try to install fabric through npm it always requires cairo:

npm install fabric --save

> canvas@1.6.13 install /home/user/Documents/yyy/electron/xxx/node_modules/canvas
> node-gyp rebuild
Package cairo was not found in the pkg-config search path.
Perhaps you should add the directory containing `cairo.pc'
to the PKG_CONFIG_PATH environment variable
No package 'cairo' found
gyp: Call to './util/has_lib.sh freetype' returned exit status 0 while in binding.gyp. while trying to load binding.gyp
gyp ERR! configure error 
gyp ERR! stack Error: `gyp` failed with exit code: 1

and it fails. I want to use it in the browser but I want to install it through npm.

fabric: 2.7.0 system: Ubuntu 18 LTS

nickensoul commented 5 years ago

@Olgagr did you tried to install node-canvas? To compile node-canvas you also need extra system-level dependencies such Cairo (see node-canvas Readme). Pre-builts are should be provided in canvas version 2 and up, and as I can see from @asturur comment above,

The PR that enable to work with canvas 2 is nearly done, is here: #5356

the PR has been merged. I can't confirm it works, but we were forced to install canvas@2 into project to make Fabric work. Also, at now we have installed some system-level deps for node-canvas, but it fails to compile. Anyway, it doesn't crash npm install process at all, referring to optional dependency (as it should work). Need approve from @asturur about canvas@2 support.

asturur commented 5 years ago

canvas@2 support can be used in fabric 3.0 that is fabric 2.7.0 + bugfixes + node-canvas2

Is ready, i m clearing out emails to see if there is some weird bug to fix before releasing.

node-canvas2 is prebuilt, so no more building headaches if you are in one of the supported platforms. If you are running on an strange windows server or weird linux arch, you will have to compile as always.