本方法仅适用用于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. 死磕java(1)

    java入门 package com.sougn.new1; public class new1 { /**   * @param args   */  public static void main ...

  2. Dubbo学习系列之十七(微服务Soul网关)

    论起微服务,哪能不谈网关,老将有Zuul,后继有Gateway,但这些都和SpringCloud关系密切,其他网关如Kong,因Lua原因,玩起来略不顺手.这不,就来了个Soul,我顺便拿来整进了我在 ...

  3. MongoDB 4.2新特性:分布式事务、字段级加密、通配符索引、物化视图

    MongoDB 4.2已经发布,我们来看看它增加了哪些新特性?分布式事务?数据库加密?通配符索引? 在2019年MongoDB World大会上,CTO Eliot Horowitz介绍了MongoD ...

  4. ntp时间服务器 时间同步

    具体两种模式 1.服务器数量比较少,可以直接与时间服务器同步 2.本地服务器较多,在本地自建时间同步服务器,     时间同步的两个命令 ntpd :         校准时间,一点点的校准过来时间的 ...

  5. Nginx location配置 正则表达式

    一. location 的匹配符 Syntax: location [ = | ~ | ~* | ^~ ] uri { ... }location @name { ... }     1.  语法格式 ...

  6. 《自拍教程19》ffmpeg_音视频图像转码工具

    ffmpeg命令介绍 ffmpeg.exe(linux/imac一般不带后缀,ffmpeg), 是一款音视频编解码的命令行工具软件, 常用于多媒体测试的文件制作与转码. 我们常用的:格式工厂,Medi ...

  7. 安利自己写的easy-clipboard库

    概述 clipboard.js 是一个非常好用的剪切板插件,但是随着前端框架的演变,用户与网页交互的方式越来越多,不仅限于点击事件了,并且在很多情况下,我们可能不需要它强制性自带的点击事件,所以我打算 ...

  8. Day7前端学习之路——多栏布局

    该文章主要讨论两栏布局和三栏布局,三栏布局包括很著名的圣杯布局和双飞翼布局 一.两栏布局的七种方法(左边固定,右边自适应) 原理: block水平元素宽度能够跟随父容器调节的流动特性,block级别的 ...

  9. mac 软件相关的

    mac 系统教学 https://www.w3cschool.cn/macdevsetup/carp1i83.html 可以查看的软件网站 https://www.ifunmac.com/ https ...

  10. linux使用和基础操作

    1.linux系统初使用 linux有图形终端和字符终端,关于linux学习以字符终端为主,即命令行操作: [root@centos7 ~]#runlevel 查看当前工作模式N 3 //3为字符终端 ...