首页 > 其他分享> 文章详细

基于vue/webpack的tinypng插件

2022-01-08 11:58:29 阅读：174 来源： 互联网

标签：插件 vue XXXX tinypng js key config

介绍

适用于vue和webpack的tinypng插件
npm地址

特性

本地建立缓存，根据记录判断资源是否发生改变，未改变时不会重复进行压缩，节约资源

使用

第一步：设置key

第一种：创建 tinypng.js

路径为: {你的根目录}/tinypng.js

tinypng.js:

module.exports = {
	key: "XXXX",
};

第二种.set key in options.config

new tinypngPlugin({
    config: {
        key: "XXXX",
    }
})

优先级： config里的key会覆盖tinypng.js

第二步：加载插件

webpack

module.exports = {
    plugins: [
        new tinypngPlugin()
    ]
};

vue

configureWebpack: (config) => {
    return {
        plugins: [
            new tinypngPlugin()
        ]
    }
}

配置属性

config.key

tinypng的key

key:XXX,

use

是否启动插件

default: true

use: true/false,

reg

需要压缩资源后缀的正则效验

default: /.(png|jpe?g|bmp|gif)/i

reg: XXXX

标签：插件,vue,XXXX,tinypng,js,key,config
来源： https://blog.csdn.net/laxnocsdn/article/details/122378069

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9