本方法仅适用用于window系统

安装canvas需要当前工作环境拥有python环境,且只能适用python2.7版本,v3.x.x版本会造成系统报错

1.在管理员权限下 使用choco install -y python2 gtk-runtime microsoft-build-tools libjpeg-turbo

自动安装python2.7,c++环境;如果本机未安装choco,可以使用以下npm命令安装

npm i -g windows-build-tools来安装所有的环境

到当前界面才算成功,安装vs工具的时候耗时比较长,需要确保电脑存在 .Net Framework 的框架,如果不存在工具会出现安装失败。

在网上查找了一下解决办法,直接进入链接下载并安装.Net 4.6:https://www.microsoft.com/en-us/download/details.aspx?id=48137

如下所示:

下载完成后,得到一个EXE文件:

双击EXE文件进行安装:

也可以手动安装vs工具,执行上面脚本后,vs工具安装文件地址:C:\Users\Administrator\.windows-build-tools中的vs_BuildTools.exe

vs工具下载慢的处理方式:

原因

目前国内大多数地区都开通了ipv6, 而当你的电脑能接通ipv6时VS自动使用ipv6下载扩展组件, 这导致下载速度很慢

解决方案

在VS安装或升级扩展时禁用电脑的ipv6

如果禁用ipv6没用,就在做下面的配置

修改系统:C:/windows/system32/drivers/etc的hosts文件
改host : 在host最后一行加上: 110.53.72.104 download.visualstudio.microsoft.com
然后 : cmd 刷一下dns,命令: ipconfig /flushdns
最后可以ping 一下: ping download.visualstudio.microsoft.com

2.安装node-gyp

安装node-gyp需要配置系统环境,如下操作

(1)npm install -g node-gyp 安装node-gyp

(2)npm config set msvs_version 2015 配置node-gyp

(3)npm config set python C:\\Python27

(4)如果(2),(3)配置之后有报错,可使用以下方法:

node-gyp configure

node-gyp configure --msvs_version=2015

node-gyp build

3.安装GTK2,必须是GTK2,不能是GTK3,

下载GTK2之后,直接解压至C:\GTK

注意:下载GTK压缩包时,应下载与node操作系统相同的版本,32位或者64位,否则将会报错;

32位的下载地址:http://ftp.gnome.org/pub/GNOME/binaries/win32/gtk+/2.24/gtk+-bundle_2.24.10-20120208_win32.zip
64位的下载地址:http://ftp.gnome.org/pub/GNOME/binaries/win64/gtk+/2.22/gtk+-bundle_2.22.1-20101229_win64.zip

4.安装libjpeg-turbo(可选,用于JPEG支持; node-canvas 2.0及更高版本)
下载适用于Visual C ++的最新libjpeg-turbo SDK(当前为libjpeg-turbo-2.0.0-vc.exe或libjpeg-turbo-2.0.0-vc64.exe)并安装到其默认位置(C:\libjpeg-turbo如果是32位或C:\libjpeg-turbo6464位)。

Visual C ++的下载地址:http://sourceforge.net/projects/libjpeg-turbo/files/

笔记:

libjpeg-turbo和Node.js都必须为64位或32位才能成功编译。
如果使用其他位置,请jpeg_root向npm install或添加参数node-gyp rebuild。例如:node-gyp rebuild --jpeg_root=C:\somewhere\libjpeg-turbo。

5.在普通cmd下使用npm install -g canvas 安装canvas

6.如果依旧报错

在node-gyp根目录下创建binding.gyp文件

我的是在这个目录中创建

C:\Program Files (x86)\nodejs\node_modules\npm\node_modules\node-gyp

binding.gyp文件描述了建立你的模块,在类JSON格式的配置。gyp适合构建Node.js插件的准系统文件可能如下所示:

{
"targets": [
{
"target_name": "binding",
"sources": [ "src/binding.cc" ]
}
]
}

完成之后,在管理员权限下运行npm i -g windows-build-tools来安装所有的环境

然后就可以在普通的cmd下运行

npm install -g canvas

canvas安装成功

附上node-canvas安装网址

https://github.com/Automattic/node-canvas/wiki/Installation---Windows

安装canvas的更多相关文章

  1. base64 convert to file

    var fs= require('fs') var imageFile = dataUrl.replace(/^data:image\/\w+;base64,/, ""); var ...

  2. nodejs 生成验证码

    此方法需要nodejs 安装canvas 扩展 准备工作 以Linux为例 1.服务器gcc版本需4.8以上 2.安装所需扩展 yum install cairo cairo-devel cairom ...

  3. Fabric.js的使用

    最近项目有一个绘制的功能,搜了一圈发现fabric.js口碑不错,但是文档稀缺,于是东看看西搜搜的把项目的需求都给实现了,想分享一下. 篇幅有点长,但看完后可以轻松驾驭fabric.我的项目是基于VU ...

  4. HTML5 学习总结(四)——canvas绘图、WebGL、SVG

    一.Canvas canvas是HTML5中新增一个HTML5标签与操作canvas的javascript API,它可以实现在网页中完成动态的2D与3D图像技术.<canvas> 标记和 ...

  5. canvas

    1. 画布可以通过两只手指上下移动,画布大小默认为屏幕大小的2倍,通过自定义View,嵌套scollview实现. Y 2. 通过处理手指触摸事件,一根手指时,使用Canvas绘制移动路径,产生直线: ...

  6. canvas简介

    一.canvas简介 1.1 什么是canvas?(了解) 是HTML5提供的一种新标签 <canvas></canvas> 英 ['kænvəs] 美 ['kænvəs] 帆 ...

  7. Python爬虫进阶二之PySpider框架安装配置

    关于 首先,在此附上项目的地址,以及官方文档 PySpider 官方文档 安装 1. pip 首先确保你已经安装了pip,若没有安装,请参照 pip安装 2. phantomjs PhantomJS ...

  8. canvas绘图、WebGL、SVG

    目录 一.Canvas 1.1.创建canvas元素 1.2.画线 1.3.绘制矩形 1.4.绘制圆弧 1.5.绘制图像 1.6.绘制文字 1.7.随机颜色与简单动画 二.WebGL 2.1.HTML ...

  9. 帆布指纹识别(canvas fingerprinting)

    广告联盟或许网站运营者都希望能够精准定位并标识每一个个体,通过对用户行为的分析(浏览了哪些页面?搜索了哪些关键字?对什么感兴趣?点了哪些按钮?用了哪些功能?看了哪些商品?把哪些放入了购物车等等),为用 ...

随机推荐

  1. 11g与12c启动,关闭RAC

    oracle11g 关闭,启动顺序 1.关闭数据库(oracle)srvctl stop database -d rac 2.关闭集群(root)crsctl stop cluster -all 3. ...

  2. 大数据篇:HDFS

    HDFS HDFS是什么? Hadoop分布式文件系统(HDFS)是指被设计成适合运行在通用硬件(commodity hardware)上的分布式文件系统(Distributed File Syste ...

  3. Go语言实现:【剑指offer】数据流中的中位数

    该题目来源于牛客网<剑指offer>专题. 如何得到一个数据流中的中位数?如果从数据流中读出奇数个数值,那么中位数就是所有数值排序之后位于中间的数值.如果从数据流中读出偶数个数值,那么中位 ...

  4. sqlserver附加数据库时出错。有关详细信息,请单击“消息”列中的超链接

    在SqlServer中附加数据库时,有时会发生下面的错误. 解决 :可能的问题是放置附加数据库的文件夹的权限问题.如下解决.点击放置附加数据库的文件夹-->右键-->属性 权限要设置为完全 ...

  5. javascirpt获取随机数

    /* getran(min, max, n): 获取min与max之间的随机数 n: n保留浮点数数量 */ function getran(min, max, n){ return Number(( ...

  6. gcc, ld

    GCC gcc除了具备基本的c文件编译功能外,还把其它工具的功能也集成了进来,比如as的汇编功能,ld的链接功能. 因此,gcc也可以通过-Wa, option,将option传给汇编器as:也可以通 ...

  7. 打包 压缩 命令tar zip

    tar语法 #压缩tar -czvf ***.tar.gztar -cjvf ***.tar.bz2#解压缩tar -xzvf ***.tar.gztar -xjvf ***.tar.bz2 tar ...

  8. centos输入正确密码后依旧无法登陆问题

    输入正确用户名和密码时依旧无法登录. 进入单用户模式重置密码: 开机启动时,按‘E’键(倒计时结束前)进入界面 选择第二项,按‘E’键再次进入 在最后一行添加‘ 1’(空格 1) 回车键保存,回到该界 ...

  9. CentOS6.5安装指定的PHP版本(php5.5)(转)

    查询是否安装有php #rpm -qa|grep php 删除之前安装的php版本 (yum install 安装) #rpm -e php-fpm-5.3.3-47.el6.x86_64 --nod ...

  10. vue自由拖拽、缩放组件

    github地址:https://github.com/kirillmurashov/vue-drag-resize 安装: npm i -s vue-drag-resize 使用: <temp ...