本方法仅适用用于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. Windows下SVN权限配置

    Windows下SVN权限配置          按照前面的教程装完1.6.1版以后,当svnadmin create D;\svn创建仓库后,应该在仓库目录下的config目录有3个文件— auth ...

  2. android webview正确显示音标

    package com.example.fonttest; import android.support.v7.app.ActionBarActivity; import android.webkit ...

  3. nginx 源码编译 用OPENSSL源码 开启 SSL

    ./configure --prefix=/usr/local/nginx --with-openssl=/home/uniqs/thirdparty/openssl/openssl-1.1.1d - ...

  4. CCF_201604-2_俄罗斯方块

    用一个4*2的数组记录方块的位置,每一次移动前判断每个方块位置下面是否已有方块,直到不能移动,将该数组更新到原来的图上,输出即可. #include<cstdio> #include< ...

  5. HDU_5094_dfs

    http://acm.hdu.edu.cn/showproblem.php?pid=5094 bfs,vis[x][y][z],z表示钥匙的状态,用二进制来表示,key[x][y]储存当前位置钥匙的二 ...

  6. 《Python学习手册 第五版》 -第9章 元组、文件与其他核心类型

    本章的主要内容是介绍了元组和文件的使用,同时作为介绍数据类型的最后一个章节,本章也总结和复习了前面所介绍的核心数据类型,总结的部分在此不多介绍,因为前面章节都有,在此就重点介绍以下两点内容 1.元组 ...

  7. Linux系统资料

    Linux的心得: 1)Linux由众多微内核组成,其源代码完全开源: 2)Linux继承了Unix的特性,具有非常强大的网络功能,其支持所有的因特网协议,包括TCP/IPv4. TCP/IPv6和链 ...

  8. golang函数 和 条件语句

    /* if : if 语句 由一个布尔表达式后紧跟一个或多个语句组成 is else : if 语句 后可以使用可选的 else 语句, else 语句中的表达式在布尔表达式为 false 时执行 s ...

  9. Linux文本界面字体颜色修改

    环境 基于centos 6.5 在文本界面 系统目录的字体颜色是 黑底蓝字  严重看不清楚,对此作出修改 使用 vi 编辑   进入  /etc/DIR_COLORS 找到“DIR 01;34   # ...

  10. php 的file 缓存

    PDO方式连接数据库类 <?php /** * @author 黄功延 * createTime 2018/5/28 0028 09:44 */ class Db { //私有化数据库连接数据, ...