search

60late / vite-plugin-minipic

Based on sharp.js, compress your image before vite generate bundle. It's easy and fast! 基于sharp.js的vite图片压缩插件，又快又好用！
31 stars 4 forks source link

常见问题及解决方法 (common Q&A) #2

Open 60late opened 10 months ago

60late commented 10 months ago

1.插件安装不成功（Install failed） 由于wall的原因，部分地区无法直接请求github上的镜像资源
在你全局或者项目的目录的.npmrc文件中增加以下内容

registry="https://registry.npmmirror.com"
sharp_binary_host="https://npm.taobao.org/mirrors/sharp"
sharp_libvips_binary_host="https://npm.taobao.org/mirrors/sharp-libvips"

2.打包时报错(require() of ES Module XX from XX not supported.) 是由于本插件引用的chalk，boxen等插件都是基于es module的 在package.json中加入以下代码可以解决

"type": "module",

或者，你可以把vite.config.js文件的后缀名修改为mjs,这个方法同样奏效

3.Public文件夹下的文件没有被压缩（Images in /public folder will not be compressed） 该问题已修复，把插件升级至>v1.1.0版本

4.run buid 报错Error: ENOENT: no such file or directory 该问题已修复，把插件升级至>=v1.1.3版本

lish1986 commented 9 months ago

I'm using vite-vue2@1.0.0 including this plugin , the build result show error: TypeError: Intl.Segmenter is not a constructor. What happend to this? How should i fix this?

60late commented 9 months ago

I'm using vite-vue2@1.0.0 including this plugin , the build result show error: TypeError: Intl.Segmenter is not a constructor. What happend to this? How should i fix this?

This is an incompatibility with Node.js 14. Please consider upgrading your Runtime Node.js to 16+ (recommend v18+) @lish1986

lish1986 commented 9 months ago

Great. It works. I upgrade Node to v16.20.0. The build speed is faster than vite-plugin-imagemin. Thanks a lot!

yangxu52 commented 7 months ago

vite-plugin-compression2、vite-plugin-compression这种压缩插件，会在使用本插件转换图片格式并替换原文件之前进行压缩。

minipic({
  sharpOptions: {
    avif: {
      lossless: true,
    },
  },
  convert: [
    { from: 'webp', to: 'avif' },
    { from: 'png', to: 'avif' },
    { from: 'jpg', to: 'avif' },
    { from: 'jpeg', to: 'avif' },
  ],
})

如图所示： image

目前解决办法是在压缩插件中排除常见的图片格式，未来是否可以解决这个问题，或者说像webp，avif等新的web图像格式已经不需要再用gz等压缩算法等去优化体积。

60late commented 7 months ago

vite-plugin-compression2、vite-plugin-compression这种压缩插件，会在使用本插件转换图片格式并替换原文件之前进行压缩。

minipic({
  sharpOptions: {
    avif: {
      lossless: true,
    },
  },
  convert: [
    { from: 'webp', to: 'avif' },
    { from: 'png', to: 'avif' },
    { from: 'jpg', to: 'avif' },
    { from: 'jpeg', to: 'avif' },
  ],
})

如图所示： image

目前解决办法是在压缩插件中排除常见的图片格式，未来是否可以解决这个问题，或者说像webp，avif等新的web图像格式已经不需要再用gz等压缩算法等去优化体积。

@yangxu52 你好，gzip压缩一般只针对html，css和js，一般不用于图片文件，所以未来不会增加对这方面的支持 原因可以参考这篇文章 https://zhuanlan.zhihu.com/p/664651731