npm 包 imagemin-mozjpeg-full 使用教程

简介

随着互联网和 WEB 技术的迅速发展,越来越多的人关注前端开发。前端工作涵盖了诸多领域,其中重要一环便是图像优化。在网站或应用开发中,图像压缩是常见的优化手段。在 Node.js 语言环境中,有非常优秀的图像压缩包 imagemin,其中一个插件 imagemin-mozjpeg-full 优化了 jpg 格式图片的压缩效果,特别是对于高质量图片的压缩效果有更好的表现。

本篇文章将会对 imagemin-mozjpeg-full 包的使用方法进行详细解析,帮助想要使用该包的前端开发者更快速、更有效完成图像压缩的工作。

安装

使用 npm 安装 imagemin-mozjpeg-full:

--- ------- --------------------- --

基本使用

在项目的文件中,引入并配置 imagemin-mozjpeg-full 作为 imagemin 的插件即可使用。

----- -------- - --------------------
----- ------------------- - ---------------------------------

------ -- -- -
  ----- --------------------------------- -
    ------------ --------------------
    -------- -
      ---------------------
        -------- -- -- ------ --------- --
      --
    -
  -- 
  ---------------------
-----

插件配置

quality

设置压缩质量 0-100,默认为 75。

例如,以下代码压缩一张图片质量为 80:

----- --------------------------------- -
  ------------ --------------------
  -------- -
    ---------------------
      -------- -- -- ------ --------- --
    --
  -
--

progressive

开启渐进式压缩。

例如,以下代码开启渐进式压缩:

----- --------------------------------- -
  ------------ --------------------
  -------- -
    ---------------------
      ------------ ---- -- --- -----
    --
  -
--

dcScanOpt

开启动态色差扫描优化。

例如,以下代码开启动态色差扫描优化:

----- --------------------------------- -
  ------------ --------------------
  -------- -
    ---------------------
      ---------- - -- --- -
    --
  -
--

trellisQuantisation

抖动减少量化误差。

例如,以下代码开启抖动减少量化误差:

----- --------------------------------- -
  ------------ --------------------
  -------- -
    ---------------------
      -------------------- ----- -- --- ----
    --
  -
--

trellisQuantisationStrength

设置抖动减少量化误差的强度。

例如,以下代码设置抖动减少量化误差的强度为 2:

----- --------------------------------- -
  ------------ --------------------
  -------- -
    ---------------------
      -------------------- -----
      ---------------------------- - -- --- -
    --
  -
--

总结

本文介绍了 npm 包 imagemin-mozjpeg-full 的基本使用方法以及详细的插件配置说明,通过该包的使用可以在 Node.js 环境中更优雅、高效的完成图片压缩的任务。同时,了解了该包的使用也为前端开发者在图片优化上提供了更多的选择和方式。

来源:JavaScript中文网 ,转载请联系管理员! 本文地址:https://www.javascriptcn.com/post/6006735b890c4f7277583f78


猜你喜欢

  • npm 包 musical-timer 使用教程

    如果用 JavaScript 写前端页面或项目,不管是为了一些交互效果还是动态生成内容,定时器都是不可或缺的一环。而在此基础上,如何运用音乐化的方式来设计你的定时器,进而增加用户的体验感呢?这就需要使...

    4 年前
  • npm 包 ssb-clingy 使用教程

    在前端开发过程中,我们经常需要使用 npm 包来提高效率和完成复杂的功能。本文将介绍一个非常实用的 npm 包 ssb-clingy,并详细讲解它的使用方法和指导意义。

    4 年前
  • npm 包 gunsen 使用教程

    在前端开发中,我们经常需要使用各种各样的库和框架来完成我们的项目需求。npm 是一个广泛使用的 JavaScript 包管理器,它可以帮助我们更方便地使用各种 JavaScript 库和框架。

    4 年前
  • npm 包 @iwanabethatguy/axios 使用教程

    介绍 @iwanabethatguy/axios 是基于 Promise 的 HTTP 客户端,可以在 Node.js 和浏览器中使用。它具有以下特点: 在浏览器和 Node.js 中使用相同的 A...

    4 年前
  • npm 包 furkot-import-csv 使用教程

    简介 furkot-import-csv 是一个基于 Node.js 的 npm 包,它可以将 CSV 格式的数据转换成 JSON 格式,方便在前端项目中使用。CSV (Comma-Separated...

    4 年前
  • npm 包 crudone 使用教程

    概述 crudone 是一个用于快速构建 CRUD 操作的 npm 包。它可以帮助前端开发者快速搭建出基于 RESTful API 的增删改查操作界面。该 npm 包支持多种前端框架,如 React、...

    4 年前
  • npm 包 @jkearl/pratt 使用教程

    前言 在前端开发中,我们经常会用到 JavaScript 的解析器来分析代码结构,帮助我们完成语法分析以及语法树的构造等工作。而 npm 包 @jkearl/pratt 就是一款优秀的 JavaScr...

    4 年前
  • npm 包 aspis 使用教程

    在前端开发中,经常需要处理异步请求、调用 API 等操作,而 aspis 是一个可以帮助你更加方便地进行这些操作的 npm 包。它提供了一种基于装饰器的方式来处理异步操作的方法,并且可以让你的代码更加...

    4 年前
  • npm 包 windows-build-tools 使用教程

    如果你是一位前端开发人员,那么在 Windows 系统上安装一些 npm 包时,你可能会遇到一些麻烦,因为一些包需要 C++ build 工具。这些工具可以让你在 Windows 上成功安装 npm ...

    4 年前
  • npm 包 dijkstra-one-path 使用教程

    在前端开发中,我们经常需要寻找最短路径。而解决这个问题的算法之一就是 Dijkstra 算法。Dijkstra 算法对于大多数前端工程师来说不陌生。而在本文中,我将介绍一款名为 dijsktra-on...

    4 年前
  • npm 包 react-kiwi-dropdown 使用教程

    React-kiwi-dropdown 是一款基于 React 的下拉菜单组件,可以方便快捷地添加下拉菜单功能。 安装 在需要使用的 React 项目中,使用 npm 安装 react-kiwi-dr...

    4 年前
  • npm 包 irv-algo 使用教程

    IRV(Instant-Runoff Voting)是一种用于多个候选人的投票排序算法,也叫做"另类投票法"、"一轮投票法"、"选举前主要民意投票"等。IRV 算法在众多选举中使用,例如澳大利亚的联邦...

    4 年前
  • npm 包 microservice-server-routes 使用教程

    简介 microservice-server-routes 是一个基于 Node.js 的开源 npm 包,主要用于构建微服务应用时使用的路由库。该库提供了简单易用的 API 和路由设计,可以轻松搭建...

    4 年前
  • npm 包 jest-matcher-one-of 使用教程

    前言 在前端开发中,测试是必不可少的一环。而 Jest 是一款非常流行的测试框架,它提供了丰富的 API 和内置的断言库,使得测试变得更加简单和高效。 但是有时候我们需要自定义断言来满足更特定的需求,...

    4 年前
  • npm 包 @fushihara/vue-dummy 使用教程

    前言 如今,前端开发越来越流行,而 npm 作为前端包管理工具,更是成为了前端开发中不可或缺的一部分。而 @fushihara/vue-dummy 这个 npm 包,也成为了 Vue.js 开发中一个...

    4 年前
  • 使用 npm 包 @nowzoo/ngx-date-time

    简介 @nowzoo/ngx-date-time 是一个 Angular 的时间处理工具库,可以快速处理日期格式的输入,输出,以及转换。它提供了包括日期选择、日期格式化、日期计算等常见时间处理功能。

    4 年前
  • npm 包 react-state-action-hooks 使用教程

    简介 react-state-action-hooks 是一个基于 React Hooks 和 useReducer API 的 npm 包,它提供了一种统一的状态管理方案,可以帮助开发者更好地管理组...

    4 年前
  • npm 包 @piscan/blockstore 使用教程

    简介 @piscan/blockstore 是一个 Node.js 的包,提供了一个简单的方式来存储和读取区块链数据(blockchain data)。这个包主要用于开发以太坊(Ethereum)和其...

    4 年前
  • npm 包 live-source-gdoc 使用教程

    前言 前端开发工程师应该都知道,npm 是一个很好的 JavaScript 包管理工具,就像 Python 的 pip、Java 的 Maven 一样。npm 提供了一种安装、分享、版本管理等方便 J...

    4 年前
  • npm 包 excuse 使用教程

    在前端开发中,我们经常需要处理不同的错误信息和异常情况。而处理错误信息和异常情况的过程往往比较繁琐和复杂。为了简化这个过程,有许多开发者开发了各种 npm 包来提供便捷的错误处理方案。

    4 年前

相关推荐

    暂无文章