aimg2code

0.3.2 • Public • Published

中文 | EN

介绍

  • aimg2code 是一款简单易用的图片生成代码的工具,利用了多模态大模型识别文本和图像的能力。
  • 可以自定义模型,但需要注意你使用的模型需要支持以下能力:
    • 兼容 OpenAI 接口
    • 支持图像识别
  • 支持生成代码的技术栈
    • HTML + CSS
    • HTML + Tailwind
    • Vue + Tailwind

安装

环境要求:node>=18

  • 你可以全局安装, 然后在任意目录中使用aimg2code 【推荐】
npm i aimg2code -g
  • 你也可以下载npm包到你的当前工作目录中。
npm i aimg2code
  • 或者你可以使用 npx 来使用 aimg2code, 避免将npm包下载到本地。
npx aimg2code

使用

在安装 aimg2code 后,你可以在项目脚本或者命令行中使用。

  • package.jsonscripts 中新增指令
    "scripts": {
      "aimg2code": "aimg2code -i ./image.png"
    }
  • 或者直接在命令行中执行脚本,你不需要在当前工作目录中新建 package.json,目录中仅包含配置文件即可。
    npx aimg2code -i ./image.png
    全局命令使用
    aimg2code -i https:/xx.png

命令行参数介绍:

  • -i : 需要转换的图片,值为图片相对路径或者URL的字符串。支持解析本地图片和远程图片(http/https);支持传入多张图片,以,分隔,例如 "./img1.png,./img2.png"。
  • --temperature: 同调用模型时传入的参数 temperature,可自定义区间在[0, 1)中的值。temperature 值越低,生成的内容越稳定和可预测,越高则生成的内容越有创造性和多样性。传参示例 --temperature=0.1,不传此参数默认值为 0.95

配置文件介绍:

在使用 aimg2code 的当前工作目录中必须存在 aimg2code.config.jsonaimg2code 会读取配置文件完成任务。

aimg2code.config.json 有以下字段:

Name Optional Description Support CLI parameters
openaiApiKey 你使用的模型的API-KEY,必须 -
openaiModel 你使用的模型的模型名,例如 gpt-4o。默认值:gpt-4o -
openaiBaseUrl 你使用的模型的网络访问地址,例如 https://api.openai.com/v1。 默认值:https://api.openai.com/v1 -
images 需要转换成代码的图片相对路径或URL的字符串数组,支持传入多张图片, 例如 ['img1.png', 'img2.png'] -i, 若命令行脚本中有此参数,则忽略该项配置

配置文件示例:

  • 这是一个涵盖了全部配置的 aimg2code.config.json 文件,模型使用 通义千问 系列的 qwen-vl-max
// aimg2code.config.json
{
  "openaiApiKey": "你申请的API-KEY",
  "openaiModel": "qwen-vl-max",
  "openaiBaseUrl": "https://dashscope.aliyuncs.com/compatible-mode/v1",
  "images": ["./image.png"]
}
  • 最小配置,使用默认模型gpt-4o
// aimg2code.config.json
{
  "openaiApiKey": "你申请的API-KEY"
}

输出文件:

选择你要生成代码的技术栈,aimg2code 调用成功后,会在当前工作目录输出转换后的html文件,文件名格式为:output_当前时间.html

最佳实践

  • 对于同一张或者同一组图片,你可以多次调用 aimg2code 来选择最优或者最合适的结果。
  • 传入多张图片时,第一张图片建议是包含了整体的内容结构,第二张或者多张图建议是对第一张图片更详细的补充,例如局部特写。
  • 当传入内容较多的图片,生成代码不准确时,可以将图片根据内容结构切分后传入,每次只转换某一块内容的图片,可以提高准确率。

Package Sidebar

Install

npm i aimg2code

Weekly Downloads

0

Version

0.3.2

License

MIT

Unpacked Size

21.5 kB

Total Files

4

Last publish

Collaborators

  • liujilong