如何在Windows上安装Node.js Canvas

Question

如何在Windows上安装Node.js Canvas

javascriptwindowsnode.jscanvascairo

15

我正在尝试在Node.js上使用canvas，我使用的是Windows Vista。在基本方法npm install canvas失败后（请参见下面的错误），我查阅了一些教程，以下是我尝试过的内容:

来源：
installing-node-canvas-for-windows
LearnBoost/node-canvas/wiki/Installation---Windows

我安装了旧版Python（2.7.5）并将其添加到了PATH中（并从PATH中移除了Python 3.2）
我检查了是否已安装Microsoft Visual Studio 2010专业版
我从http://ftp.gnome.org/pub/gnome/binaries/win32/gtk+/2.24/gtk+-bundle_2.24.10-20120208_win32.zip下载了“all in one” GTK软件包，在C:\GTK\中解压缩，并将“C:\GTK\bin”添加到了PATH

控制台日志（在cmd中运行npm install canvas后）：
日志包含几个警告，我不认为这些是问题 - 大多数是类似于“从double转换为float”，还有一个用红色标记的错误：

init.cc
d:\pathToApp\node_modules\canvas\src\PNG.h(5): fatal error C1083: Cannot
open include file: 'cairo.h': No such file or directory [d:\pathToApp\n
ode_modules\canvas\build\canvas.vcxproj]

在日志的最后，有如下内容：

gyp ERR! build error
gyp ERR! stack Error: `C:\Windows\Microsoft.NET\Framework\v4.0.30319\msbuild.exe
` failed with exit code: 1
gyp ERR! stack     at ChildProcess.onExit (C:\Program Files\nodejs\node_modules\
npm\node_modules\node-gyp\lib\build.js:267:23)
gyp ERR! stack     at ChildProcess.EventEmitter.emit (events.js:98:17)
gyp ERR! stack     at Process.ChildProcess._handle.onexit (child_process.js:789:
12)
gyp ERR! System Windows_NT 6.0.6002
gyp ERR! command "node" "C:\\Program Files\\nodejs\\node_modules\\npm\\node_modu
les\\node-gyp\\bin\\node-gyp.js" "rebuild"
gyp ERR! cwd d:\pathToApp\node_modules\canvas
gyp ERR! node -v v0.10.16
gyp ERR! node-gyp -v v0.10.9
gyp ERR! not ok
npm ERR! weird error 1
npm ERR! not ok code 0

之后在node-module文件夹中没有出现任何内容（没有canvas子目录，npm在安装失败后删除了子目录）。

所以我尝试手动从Github下载canvas模块，将其解压缩到node-modules中，然后在node-modules/canvas中运行node-gyp configure，成功后运行node-gyp build，但不幸的是仍然出现相同的错误Cannot open include file: 'cairo.h'。

我已经仔细阅读了所有相关资料。如果您有任何建议，请告诉我。

- venca163

你是32位还是64位？ - Mathew Kurian

有没有解决方案？ - Muhammad Umer

32位 | 没有解决方案，过了一段时间我放弃了（使用Ubuntu） - venca163

1

我已经成功在Windows 8上运行它（请参见下面的描述）。很抱歉我不能接受任何解决方案，但这个问题似乎没有“唯一正确”的答案。 - venca163

5个回答

1

经过漫长而艰辛的过程，我设法在Windows上使其工作。我有最后几个建议，您可以尝试一下，这些都是我的清单上有的。

将c:\GTK中的所有dll文件复制到canvas\build\Release文件夹中。

将IEShims.dll从c:\program files(x86)\Internet Explorer复制到canvas\build\Release文件夹中。

然后运行node-gyp build。

祝你好运。

- Andy

谢谢。在我尝试之前，我必须问一下，我是否需要创建文件夹canvas\build\Release？（所以我应该手动下载canvas模块，作为我的第二个尝试？）因为正如我所提到的，npm会在失败后删除所有内容。 - venca163

不确定。试一下，看看会发生什么。 - Andy

没有生效 =（我下载了canvas模块，解压并且1）手动创建文件夹并将文件复制到那里，或者2）运行node-gyp configure并将文件复制到那里，然后在两种情况下最终都运行了node-gyp build，仍然是相同的错误。（我还尝试过创建文件夹，在那里复制文件，然后运行npm install canvas）但无论如何，感谢您！如果您有其他想法，请告诉我。 - venca163

有关此问题的任何更新或解决方案吗？我现在也遇到了同样的问题，只能在客户端创建画布并使用 toDataUrl 下载/保存每个文件。这不是理想的解决方法。 - Chris

1

在尝试安装paperjs时，我遇到了canvas的问题。

以下是解决方法。

我的具体情况

Windows 7 x64
node-v0.10.26-x64
GTK+ 2.22 x64

GTK

请确保您阅读了README文件。这里有一些必要的说明，第一次我忽略了它们。例如：

运行：pkg-config --cflags gtk+-2.0

运行：gtk-demo 并验证其是否正常工作

运行pkg-config让我知道需要将<GTK Directory>\lib\pkgconfig添加到PKG_CONFIG_PATH环境变量中。

canvas

我使用这个作为指南： https://github.com/LearnBoost/node-canvas/wiki/Installation---Windows 注意：我在我的计算机上安装了Visual Studio 2010、2012和2013，所以我不需要处理MSVC依赖项。

npm install canvas一直失败 - 并清理自己（混蛋） - 所以我从npm-cache中获取了缓存版本： %USERPROFILE%\AppData\Roaming\npm-cache\canvas\1.1.3\package。将此目录复制到项目的node_modules目录中，并将其重命名为canvas。在命令行中进入新创建的canvas目录。

运行npm install nan。

在你可以成功运行node-gyp configure之前，你需要验证binding.gyp中的GTK路径。

在第5行：

'GTK_Root%': 'C:/GTK', # 设置GTK全合一包的位置

现在你可以尝试node-gyp configure。如果成功了，太棒了！现在你可以构建它：node-gyp build。就是这样。如果你想安装paper，现在可以了。万岁！如果这不起作用，或者你有什么要补充的，请不要害羞！请评论，让我们都受益。

- slamborne

0

这里是我找到的最新信息，关于如何安装运行node-gyp所需的组件，而node-gyp又是编译canvas（和jsdom）代码所必需的。为了防止链接失效，我将在此重复这些说明。我已在我的Win7 x64机器上测试过这些说明，并且第一次就成功了。

在Windows XP/Vista/7上，node-gyp需要Python 2.7和Visual Studio 2010。

根据Microsoft Visual C++ 2010 Service Pack 1 Compiler Update for the Windows SDK 7.1中的自述文件，为确保系统具有支持的配置，请卸载以下产品，然后按照列出的顺序重新安装：

Visual Studio 2010
Windows SDK 7.1 注意：如果安装时出现错误，也许this link可以帮助您。
Visual Studio 2010 SP1
Visual C++ 2010 SP1 Compiler Update for the Windows SDK 7.1

在x64环境下，列表中的最后一个更新修复了有关缺少编译器和error MSB4019: The imported project "C:\Microsoft.Cpp.Default.props" was not found.的错误。

- Andy

0

你需要cairo库，它是捆绑在GTK中的。

- user2910458

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- venca163 · Accepted Answer

我已经在我的新Windows 8电脑上使其正常工作，所以我想分享一些细节，这对其他人可能有所帮助。

我使用:

Windows 8.1（64位）
Visual Studio 2013（更新2）
Python 2.7.8
GTK for Windows 64 bit (http://www.gtk.org/download/win64.php)
node 0.10.28
node-gyp 1.0.1

步骤

确保您的路径中包含Python 2和GTK\bin。

我从https://github.com/Automattic/node-canvas手动下载了文件，并将其保存到node_modules/canvas中。

然后在canvas目录中运行node-gyp configure build。出现错误。我必须编辑binding.gyp（https://github.com/Automattic/node-canvas/blob/master/binding.gyp），以便与GTK文件夹中的实际文件匹配。

例如：

第59行：“（GTK_Root）/ lib / libpng.lib” ->“（GTK_Root）/ lib / libpng.dll.a”
第34行：“（GTK_Root）/ bin / libpng14-14.dll” ->“（GTK_Root）/ bin / libpng15-15.dll”
...

可能会有更多，您应该能够从错误日志中读取哪些文件存在问题，然后编辑名称以匹配GTK文件夹中的文件。

编辑binding.gyp后，命令node-gyp configure build成功完成。尽管我无法在Canvas中使用某些jpg文件（我没有进行适当测试），但png文件可以正常工作。

如果node-gyp失败

可能会发生每个node-gyp命令都失败并显示类似以下消息（可能标记为红色）：

"...bcrypt_lib.vcxproj(47,46): error MSB4025: Could not load file project. An invalid character for the specified encoding., Line 47, position 46."

这很可能是因为您的用户名文件夹名称中有特殊字符。（事实上，Windows 8自动从您的名字创建用户文件夹名称是Win 8最糟糕的事情之一）。

两个快速解决方案：

创建一个名字为a且没有特殊字符的普通用户，并从该帐户运行node-gyp configure build
使用这个快速修复方法（对我有效）：https://github.com/TooTallNate/node-gyp/pull/366

希望这可以帮到你。