好久沒更新博客了，因為工作越來越忙，沒什麼時間去記錄一些問題，最近閑下來一點，由於某些原因不得不暫時在Windows下做開發，項目用到了node-canvas處理圖片什麼的，在安裝的時候各種報錯，確實讓人很抓狂，這裡簡單記錄下： 首先說明下，node-canvas的 官方git倉庫 https:// ...
好久沒更新博客了，因為工作越來越忙，沒什麼時間去記錄一些問題，最近閑下來一點，由於某些原因不得不暫時在Windows下做開發，項目用到了node-canvas處理圖片什麼的，在安裝的時候各種報錯，確實讓人很抓狂，這裡簡單記錄下：
首先說明下，node-canvas的
官方git倉庫 https://github.com/Automattic/node-canvas，
在沒有安裝前置依賴之前，直接npm install canvas是一定裝不上的，其實網上有很多關於win安裝canvas的文章，報錯的時候搜了很多，不過最官方的方法在這：
Installation: Windows · Automattic/node-canvas Wiki (github.com)
官方給出了兩種安裝依賴的方法，一種是一個一個純手動安裝（不建議，比較麻煩），一種是下載Chocolatey然後一鍵安裝，我的建議是使用Chocolatey 更方便一些
下麵給出使用Chocolatey方法安裝node-canvas的步驟
一、安裝Chocolatey
1）打開終端管理員powershell，運行
Get-ExecutionPolicy
如果顯示 Restricted ，那麼要執行
Set-ExecutionPolicy AllSigned
2）複製如下命令到shell，回車執行
Set-ExecutionPolicy Bypass -Scope Process -Force; [System.Net.ServicePointManager]::SecurityProtocol = [System.Net.ServicePointManager]::SecurityProtocol -bor 3072; iex ((New-Object System.Net.WebClient).DownloadString('https://community.chocolatey.org/install.ps1'))
等待一會兒，如果沒有報錯error的信息，執行下 choco，出現版本信息，那麼就應該安裝成功了
二、安裝canvas前置依賴
在shell中執行
choco install -y python2 gtk-runtime microsoft-build-tools libjpeg-turbo
這個過程看網路情況，我這邊是會等幾分鐘
一般情況應該只有一個包 libjpeg-turbo 顯示安裝錯誤，其他都是安裝成功的，不過沒關係，打開C盤看下如果 C:\libjpeg-turbo64 文件夾下是這樣的，那麼就代表成功了（博主在win10、win11裝過都是這樣滴）
三、下載GTK-2
首先下載安裝包，下載完成後，解壓到 C:\GTK
四、安裝canvas
1）在項目根目錄下創建 .npmrc 文件（如果已存在就把代碼加在下麵即可），內容如下
canvas_binary_host_mirror=https://registry.npmmirror.com/-/binary/canvas
這一步非常的重要，就是給npm安裝canvas時換個鏡像，博主就是在這步卡了很久，最後發現是預設GitHub的源太慢了，導致總是安裝失敗，法克魷！
2）ok到這一步終於可以安裝canvas了！
npm install canvas
沒什麼問題的話就可以很快安裝成功了，good
ps：在換源之前我這邊是這麼報錯的，有時候還不一樣
> npm install canvas > [email protected] install C:\Users\LijiaHou\Desktop\ReactAndVue\koaDemo\node_modules\canvas > node-pre-gyp install --fallback-to-build --update-binary node-pre-gyp ERR! install request to https://github.com/Automattic/node-canvas/releases/download/v2.11.2/canvas-v2.11.2-node-v83-win32-unknown-x64.tar.gz failed, reason: connect ETIMEDOUT 20.205.243.166:443 node-pre-gyp WARN Pre-built binaries not installable for [email protected] and [email protected] (node-v83 ABI, unknown) (falling back to source compile with node-gyp) node-pre-gyp WARN Hit error request to https://github.com/Automattic/node-canvas/releases/download/v2.11.2/canvas-v2.11.2-node-v83-win32-unknown-x64.tar.gz failed, reason: connect ETIMEDOUT 20.205.243.166:443 gyp ERR! find VS gyp ERR! find VS msvs_version was set from command line or npm config
應該沒有遺漏什麼步驟吧，最後希望能幫到朋友們√
