介紹/info
auto compress img by tinypng when used webpack or vue
This plugin can record the compression and will not recompress the file if it is not updated
適用于vue和webpack的tinypng插件,支持調整圖片尺寸
能夠根據記錄判斷資源是否發生改變,未改變時不會重復進行壓縮
npm地址
使用/how to use
設定key/set key
1.create tinypng.js
path: {your workspace}/tinypng.js
tinypng.js:
module.exports = {
key: "XXXX",
};
2.set key in options.config
new tinypngPlugin({
config: {
key: "XXXX",
}
})
import/匯入
webpack
module.exports = {
plugins: [
new tinypngPlugin()
]
};
vue
configureWebpack: (config) => {
return {
plugins: [
new tinypngPlugin()
]
}
}
配置屬性/options
option.configName
config file name , no suffix
default "tinypng"
組態檔名稱
默認為"tinypng"
configName: ""
option.cachePath
cache path
default ".tinypng"
壓縮記錄快取路徑
默認為".tinypng",基于根目錄
cachePath: ""
option.cacheName
cache name
default "hash.json"
壓縮記錄快取檔案名
默認為"hash.json"
cacheName: ""
option.reg
compress img reg
default: /.(png|jpe?g|bmp)/i
需要壓縮資源后綴的正則效驗
默認: /.(png|jpe?g|bmp)/i
reg: XXXX
option.use
true/false run this plugin
default: true
是否啟動插件
默認: true
use: true/false,
option.cache
Whether to record compressed cache
default: true
是否啟用快取記錄
默認: true
cache: true/false,
option.config
option.config.key
your key
tinypng的key
key:XXX,
option.config.method
resize method scale/fit/cover/thumb
look
圖片調整模式 支持:scale/fit/cover/thumb
詳情參考
method: ""
option.config.width
resize asset width
調整圖片的寬度尺寸
width: ""
option.config.height
resize asset height
調整圖片的高度尺寸
height: ""
轉載請註明出處,本文鏈接:https://www.uj5u.com/qiye/415305.html
標籤:其他
