Image Builder

一个用于自动处理图片并上传到阿里云 OSS 的 Node.js 工具。

功能特点

• 自动监听图片文件变化
• 支持图片压缩和格式转换
• 文件上传缓存
• 阿里云 OSS 集成
• TypeScript 支持
• 自动生成图片资源映射文件
• 支持批量处理图片
• 支持自定义输出目录和映射文件路径

安装

# 使用 pnpm 安装
pnpm install image-builder

使用方法

1. 创建配置文件：

const { ImageBuilder } = require('image-builder');
const path = require('path');

const builder = new ImageBuilder({
  watch: true, // 是否启用文件监听
  imagesDir: './images', // 图片源目录
  cacheDir: './.cache', // 缓存目录
  outputPath: path.join(process.cwd(), 'assets', 'index.js'), // 映射文件输出路径
  ossConfig: {
    region: 'oss-cn-beijing', // OSS 区域
    accessKeyId: 'your-access-key-id', // 访问密钥 ID
    accessKeySecret: 'your-access-key-secret', // 访问密钥密码
    bucket: 'your-bucket-name', // 存储桶名称
    baseUrl: 'https://your-bucket.oss-cn-beijing.aliyuncs.com', // OSS 基础 URL
    secure: true // 是否使用 HTTPS
  },
  compressionOptions: {
    quality: 80, // 压缩质量
    format: 'jpeg', // 输出格式
    width: 1920, // 最大宽度
    height: 1080 // 最大高度
  }
});

// 启动处理
builder.start();

2. 在代码中使用生成的图片映射：

import Image from './assets/index.js';

// 使用图片
const imageUrl = Image.目录名.文件名;

配置选项

ImageBuilderOptions

| 选项 | 类型 | 必填 | 描述 | |------|------|------|------| | watch | boolean | 否 | 是否启用文件监听 | | imagesDir | string | 是 | 图片源目录路径 | | cacheDir | string | 否 | 缓存目录路径 | | outputPath | string | 是 | 映射文件输出路径 | | ossConfig | OSSConfig | 是 | 阿里云 OSS 配置 | | compressionOptions | CompressionOptions | 否 | 图片压缩选项 |

OSSConfig

| 选项 | 类型 | 必填 | 描述 | |------|------|------|------| | region | string | 是 | OSS 区域 | | accessKeyId | string | 是 | 访问密钥 ID | | accessKeySecret | string | 是 | 访问密钥密码 | | bucket | string | 是 | 存储桶名称 | | baseUrl | string | 是 | OSS 基础 URL | | secure | boolean | 否 | 是否使用 HTTPS |

CompressionOptions

| 选项 | 类型 | 必填 | 描述 | |------|------|------|------| | quality | number | 否 | 压缩质量 (1-100) | | format | 'jpeg' | 'png' | 'webp' | 否 | 输出格式 | | width | number | 否 | 最大宽度 | | height | number | 否 | 最大高度 |

开发

# 安装依赖
pnpm install

# 构建
pnpm run build

# 开发模式
pnpm run dev

示例

查看 demo 目录下的示例代码，了解如何使用该工具。

注意事项

1. 确保使用 Node.js 18 或更高版本
2. 建议使用 pnpm 作为包管理工具
3. 上传到 OSS 失败时会自动使用本地相对路径作为备选
4. 生成的映射文件会自动创建目录（如果不存在）

许可证

MIT