npm 包 sharp 使用教程

前言

在前端开发中，图片处理是一项必不可少的任务。对于一些精细的图片处理需要使用到一些高级的功能，比如裁剪、缩放、旋转等等。Sharp 就是一个非常优秀的 npm 包，专注于高质量的图片处理，支持各种不同的格式，包括 JPEG、PNG、WebP 和 GIF 等等。

本篇文章将详细介绍 Sharp 的使用教程，帮助读者在前端开发中轻松地处理图片。

安装

安装 Sharp 很简单，只需要在终端运行以下命令即可：

npm install sharp

引入模块

在代码中引入 Sharp 模块，代码如下：

const sharp = require('sharp');

基本用法

创建一个 Sharp 的实例

创建一个新的 Sharp 对象的方法是通过传入要处理的图片的路径：

const sharpInstance = sharp('path/to/image.jpg');

改变图像尺寸

sharpInstance.resize(200, 300)
  .toFile('path/to/resize/image.jpg', (err, info) => {
    console.log(info);
  });

改变图像旋转度数

sharpInstance.rotate(90)
  .toFile('path/to/rotate/image.jpg', (err, info) => {
    console.log(info);
  });

添加水印

sharpInstance.composite([{
    input: 'path/to/watermark.png',
    gravity: 'south'
  }])
  .toFile('path/to/composite/image.jpg', (err, info) => {
    console.log(info);
  });

深度用法

读取图片元数据

sharpInstance.metadata()
  .then((metadata) => {
    console.log(metadata);
  });

设置输出的格式

sharpInstance.toFormat('webp')
  .toFile('path/to/output/webp', (err, info) => {
    console.log(info);
  });

改变图像的 Quality（质量）

sharpInstance.jpeg({
    quality: 80
  })
  .toFile('path/to/jpeg/image.jpg', (err, info) => {
    console.log(info);
  });

改变图像的颜色空间

sharpInstance.toColorspace('lab')
  .toFile('path/to/output/laba.jpg', (err, info) => {
    console.log(info);
  });

批处理

sharp('path/to/image.jpg')
  .resize(200, 300)
  .flip()
  .toFile('path/to/output/image.jpg', (err, info) => {
    console.log(info);
  });

结尾

本篇文章详细介绍了 Sharp 的使用方法以及各种 API 的功能。读者可以在前端开发中使用这些方法来实现各种图片处理需求。对于更多未涉及的 API 可以参考 Sharp 官方文档 进行查看。

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/57758