你需要将SVG文件转换为PNG、JPEG、TIFF、WEBP 和 HEIF 格式吗?本文将指导你如何转换为所有这些类型的格式。
我们将使用 Node.js 和Sharp npm 包来完成大部分繁重的工作。
安装Sharp Npm Package
首先你需要安装 npm 包。你可以使用下面的 npm 或 yarn 命令安装:
- $ npm install sharp --save
- $ 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)
- })
让我们分解代码的每个部分:
当你运行代码时,应该得到类似的输出:
- {
- 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.co... 。
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文件。
文档: http://sharp.pixelplumbing.co... 。
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文件。
文档: http://sharp.pixelplumbing.co... 。
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文件。
文档: http://sharp.pixelplumbing.co... 。
希望本文能帮助你完成编码工作!