在Node.js中如何將SVG圖像轉(zhuǎn)換為PNG，JPEG，TIFF，WEBP和HEIF格式

這篇文章將為大家詳細講解有關(guān)在Node.js中如何將SVG圖像轉(zhuǎn)換為PNG，JPEG，TIFF，WEBP和HEIF格式，小編覺得挺實用的，因此分享給大家做個參考，希望大家閱讀完這篇文章后可以有所收獲。

安裝Sharp Npm Package

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

Npm

$ npm install sharp --save

Yarn

$ yarn add sharp

現(xiàn)在我們已經(jīng)準備好開始編寫一些代碼并轉(zhuǎn)換圖像了！

SVG 轉(zhuǎn) PNG

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

這是完整的代碼：

// Node.js

const sharp = require("sharp")

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

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

1. 首先，導(dǎo)入 sharp 包并將其保存在 sharp 變量中。

2. 然后，我們用 sharp 包來讀取我們的 file.svg 文件，將其轉(zhuǎn)換為 PNG 并使用 .toFile() 函數(shù)將新的 PNG文件寫入你的目錄。

3. sharp 方法是一個 promise，我們用它來獲取文件的 info。

4. 最后，我們用 .catch() 方法來捕獲并 console.log() 所有錯誤。

當(dāng)你運行代碼時，應(yīng)該得到類似的輸出：

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

你應(yīng)該能夠在項目目錄中看到新的 PNG 文件。

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

SVG 轉(zhuǎn) JPEG

現(xiàn)在，讓我們將 SVG 文件轉(zhuǎn)換為 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)
  })

當(dāng)運行代碼時，你應(yīng)該得到類似的輸出：

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

你應(yīng)該在項目目錄中看到新的JPEG文件。

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

SVG 轉(zhuǎn) TIFF

接下來，讓我們將SVG文件轉(zhuǎn)換為標記圖像文件格式（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)
 })

當(dāng)你運行代碼時，應(yīng)該得到類似的輸出：

{
  format: 'tiff',
  width: 2500,
  height: 527,
  channels: 3,
  premultiplied: false,
  size: 65778
}

你應(yīng)該在項目目錄中看到新的TIFF文件。

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

SVG到WEBP

接下來，將 SVG 文件轉(zhuǎn)換為 WEBP 文件格式。確保你在項目目錄的根目錄中有一個我們可以使用的SVG文件。

這是完整的代碼：

const sharp = require("sharp")

sharp("file.svg")
 .webp()
 .toFile("new-file.webp")
 .then(function(info) {
  console.log(info)
 })
 .catch(function(err) {
  console.log(err)
 })

輸出：

{
 format: 'webp',
 width: 2500,
 height: 527,
 channels: 4,
 premultiplied: false,
 size: 35600
}

你應(yīng)該在項目目錄中看到新的WEBP文件。

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

SVG到HEIF

最后一個例子，讓我們將 SVG 文件轉(zhuǎn)換為高效圖像文件（HEIF）格式。確保你在項目目錄的根目錄中有一個可用的SVG文件。

這是完整的代碼：

const sharp = require("sharp")

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

你還應(yīng)該在項目目錄中看到新的HEIF文件。

關(guān)于“在Node.js中如何將SVG圖像轉(zhuǎn)換為PNG，JPEG，TIFF，WEBP和HEIF格式”這篇文章就分享到這里了，希望以上內(nèi)容可以對大家有一定的幫助，使各位可以學(xué)到更多知識，如果覺得文章不錯，請把它分享出去讓更多的人看到。