webpack-image-resize-plugin
Advanced tools
Comparing version
{ | ||
"name": "webpack-image-resize-plugin", | ||
"version": "0.0.2", | ||
"version": "0.0.3", | ||
"main": "src/index.js", | ||
@@ -5,0 +5,0 @@ "description": "Webpack plugin to resize image assets", |
# webpack-webp-convert-plugin | ||
이미지들을 webp로 변환해주는 webapck plugin | ||
Resize your images using webpack plugin! | ||
누구나 따라할 수 있게 쉽게 구현 | ||
## Support | ||
@@ -13,7 +11,7 @@ | ||
<img width="738" alt="이미지사이즈 전" src="https://user-images.githubusercontent.com/42544600/131214048-99cc4907-7654-4341-83ed-6af12185cf3c.png"> | ||
<img width="532" alt="이미지 리사이즈 전" src="https://user-images.githubusercontent.com/42544600/131217247-ff6c2719-65a7-4d47-8221-21300ac4fe66.png"> | ||
## After | ||
<img width="738" alt="스크린샷 2021-08-28 오후 6 51 02" src="https://user-images.githubusercontent.com/42544600/131214045-5eebdec3-90ed-4e37-912f-32ada84592e3.png"> | ||
<img width="581" alt="이미지 리사이즈 후" src="https://user-images.githubusercontent.com/42544600/131217340-7dc0d07e-a61a-49d8-b728-311c1c40e366.png"> | ||
@@ -35,5 +33,8 @@ ## Usage | ||
... | ||
plugins: [new WebpackImageResizePlugin(),] | ||
plugins: [new WebpackImageResizePlugin({ | ||
width: 1920, | ||
height: 1080 | ||
})] | ||
... | ||
``` |
@@ -39,38 +39,2 @@ // const imagemin = require("imagemin"); | ||
// const processImageminAsync = imagemin | ||
// .buffer(assetFile.source(), { | ||
// plugins: [ | ||
// imageminOptipng({ interlaced: true, optimizationLevel: 7 }), | ||
// imageminMozjpeg({ quality: 80 }), | ||
// imageminPngquant(), | ||
// imageminGiflossy(), | ||
// imageminSvgo(), | ||
// imageminWebp({ | ||
// quality: 75, | ||
// // resize: { | ||
// // width: this.width, | ||
// // height: this.height, | ||
// // }, | ||
// }), | ||
// ], | ||
// }) | ||
// .then((processedBuffer) => { | ||
// const size = | ||
// (assetFile.size() - processedBuffer.length) / 1024; | ||
// delete compilation.assets[assetFileName]; | ||
// compilation.emitAsset(assetFileName, { | ||
// source: () => processedBuffer, | ||
// size: () => processedBuffer.length, | ||
// }); | ||
// return size; | ||
// }) | ||
// .catch((error) => { | ||
// console.error(error); | ||
// }); | ||
// return processImageminAsync; | ||
const processedSharpToAssetFileAsync = sharp(assetFile.source()) | ||
@@ -77,0 +41,0 @@ .resize(this.width, this.height) |
39
2.63%14219040
-0.01%723
-4.11%