在Node.js中将SVG图像转换为PNG，JPEG，TIFF，WEBP和HEIF格式的方法

PNG，JPEG，TIFF，WEBP和HEIF格式的⽅法

介绍

你需要将SVG⽂件转换为PNG、JPEG、TIFF、WEBP 和 HEIF 格式吗？本⽂将指导你如何转换为所有这些类型的格式。我们将使⽤ Node.js 和npm 包来完成⼤部分繁重的⼯作。⽬录

1. 安装 Sharp Npm 包2. SVG 转 PNG3. SVG 转 JPEG4. SVG 转 TIFF5. SVG 转 WEBP6. SVG 转 HEIF安装Sharp Npm Package

⾸先你需要安装 npm 包。你可以使⽤下⾯的 npm 或 yarn 命令安装：Npm

$ npm install sharp --save

Yarn

$ yarn add sharp

现在我们已经准备好开始编写⼀些代码并转换图像了！SVG 转 PNG

对于第⼀个例⼦，我们将 SVG⽂ 件转换为可移植⽹络图形（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. ⾸先，导⼊ sharp 包并将其保存在 sharp 变量中。

2. 然后，我们⽤ sharp 包来读取我们的 file.svg ⽂件，将其转换为 PNG 并使⽤ .toFile() 函数将新的 PNG⽂件写⼊你的⽬录。

3. sharp ⽅法是⼀个 promise，我们⽤它来获取⽂件的 info。4. 最后，我们⽤ .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⽂件。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) })

当你运⾏代码时，应该得到类似的输出：

{

format: 'tiff', width: 2500, height: 527, channels: 3,

premultiplied: false, size: 65778}

你应该在项⽬⽬录中看到新的TIFF⽂件。SVG到WEBP

接下来，将 SVG ⽂件转换为 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}

你应该在项⽬⽬录中看到新的WEBP⽂件。SVG到HEIF

最后⼀个例⼦，让我们将 SVG ⽂件转换为⾼效图像⽂件（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) })

你还应该在项⽬⽬录中看到新的HEIF⽂件。结论

希望本⽂能帮助你完成编码⼯作！也希望⼤家多多⽀持。