SRCSET CODEGEN

generates typescript for a images scaled at different scale factors with filenames ending in @2x, @3x and so on.

 .
 ├── sd
+│   ├── smile.ts
 │   ├── smile.png
 │   ├── [email protected]
 │   └── [email protected]
+├── single.ts
+├── smile.ts
+├── vector.ts
 ├── single.png
 ├── smile.png
 ├── [email protected]

example of generated code:

// generated by srcset-codegen
import src from "./smile.png";
import src2x from "./[email protected]";
import src3x from "./[email protected]";

const width = 107;
const height = 107;
const srcSet = `${src2x} 2x, ${src3x} 3x`;
export default { src, width, height, srcSet };

Usage

npx srcset-codegen generate src/images

# or, to watch for filesystem changes
npx srcset-codegen generate --watch src/images

Notes

inspired by react-native images.