52 lines
1.7 KiB
JavaScript
52 lines
1.7 KiB
JavaScript
const fs = require('fs');
|
||
const path = require('path');
|
||
|
||
// 源图片目录和构建后的图片目录
|
||
const srcDir = path.join(__dirname, 'src', 'assets');
|
||
const distDir = path.join(__dirname, 'dist', 'img');
|
||
|
||
// 比较源图片和构建后图片的大小
|
||
function compareImageSizes() {
|
||
try {
|
||
// 读取dist目录下的所有图片文件
|
||
const distFiles = fs.readdirSync(distDir).filter(file => file.endsWith('.png'));
|
||
|
||
console.log('图片优化效果验证（源图片 vs 构建后图片）:');
|
||
console.log('-' .repeat(70));
|
||
console.log('源文件名'.padEnd(25), '构建后文件名'.padEnd(30), '大小对比');
|
||
console.log('-' .repeat(70));
|
||
|
||
// 遍历dist目录下的图片文件
|
||
for (const distFile of distFiles) {
|
||
// 提取源文件名（去掉hash和扩展名）
|
||
const srcFileName = distFile.replace(/\.[a-f0-9]{8}\.png$/, '.png');
|
||
const srcPath = path.join(srcDir, srcFileName);
|
||
const distPath = path.join(distDir, distFile);
|
||
|
||
// 检查源文件是否存在
|
||
if (fs.existsSync(srcPath)) {
|
||
const srcStats = fs.statSync(srcPath);
|
||
const distStats = fs.statSync(distPath);
|
||
|
||
const srcSize = srcStats.size;
|
||
const distSize = distStats.size;
|
||
const reduction = ((srcSize - distSize) / srcSize * 100).toFixed(2);
|
||
|
||
console.log(
|
||
srcFileName.padEnd(25),
|
||
distFile.padEnd(30),
|
||
`${(srcSize / 1024).toFixed(2)}KB → ${(distSize / 1024).toFixed(2)}KB (减少${reduction}%)`
|
||
);
|
||
}
|
||
}
|
||
|
||
console.log('-' .repeat(70));
|
||
|
||
} catch (error) {
|
||
console.error('验证图片优化效果时出错:', error);
|
||
}
|
||
}
|
||
|
||
// 执行验证
|
||
compareImageSizes();
|