介紹

你需要將SVG文件轉換為PNG、JPEG、TIFF、WEBP 和 HEIF 格式嗎？本文將指導你如何轉換為所有這些類型的格式。

我們將使用 Node.js 和Sharp npm 包來完成大部分繁重的工作。

目錄

安裝 Sharp Npm 包 SVG 轉 PNG SVG 轉 JPEG SVG 轉 TIFF SVG 轉 WEBP SVG 轉 HEIF

安裝Sharp Npm Package

首先你需要安裝 npm 包。你可以使用下面的 npm 或 yarn 命令安裝：

Npm

$ npm install sharp --save

Yarn

$ yarn add sharp

現在我們已經準備好開始編寫一些代碼并轉換圖像了！

SVG 轉 PNG

對于第一個例子，我們將 SVG文 件轉換為可移植網絡圖形（PNG）文件格式。確保你在項目目錄的根目錄中有一個可用的 SVG 文件。

這是完整的代碼：

// Node.jsconst sharp = require("sharp")sharp("file.svg")  .png()  .toFile("new-file.png")  .then(function(info) {    console.log(info)  })  .catch(function(err) {    console.log(err)      })

讓我們分解代碼的每個部分：

首先，導入 sharp 包并將其保存在 sharp 變量中。 然后，我們用 sharp 包來讀取我們的 file.svg 文件，將其轉換為 PNG 并使用 .toFile() 函數將新的 PNG文件寫入你的目錄。 sharp 方法是一個 promise，我們用它來獲取文件的 info。 最后，我們用 .catch() 方法來捕獲并 console.log() 所有錯誤。

當你運行代碼時，應該得到類似的輸出：

{  format: 'png',  width: 2500,  height: 527,  channels: 4,  premultiplied: false,  size: 47194}

你應該能夠在項目目錄中看到新的 PNG 文件。

還可以將其他選項傳遞給 .png() 方法來更改輸出圖像。這些包括壓縮級別、質量、顏色等。你可以在文檔中查看它們。

SVG 轉 JPEG

現在，讓我們將 SVG 文件轉換為 JPEG 格式。確保項目目錄的根目錄中有一個 SVG 文件可供使用。

這是完整的代碼：

const sharp = require("sharp")sharp("file.svg")  .png()  .toFile("new-file.jpg")  .then(function(info) {    console.log(info)  })  .catch(function(err) {    console.log(err)  })

當運行代碼時，你應該得到類似的輸出：

{  format: 'jpg',  width: 2500,  height: 527,  channels: 4,  premultiplied: false,  size: 47194}

你應該在項目目錄中看到新的JPEG文件。

文檔：http://sharp.pixelplumbing.com/en/stable/api-output/#png

SVG 轉 TIFF

接下來，讓我們將SVG文件轉換為標記圖像文件格式（TIFF）文件。確保你在項目目錄的根目錄中有一個我們可以使用的SVG文件。

這是完整的代碼：

const sharp = require("sharp")sharp("file.svg") .tiff() .toFile("new-file.tiff") .then(function(info) {  console.log(info) }) .catch(function(err) {  console.log(err) })