@shopify/get-repo-images

• ⚡️ An extremely fast repository crawler to find images across multiple repos
• 🌌 Find where the images are referenced in code... or not!
• 💾 Save the results to a JSON file
• 🌏 Generate a Next.js website to browse, sort and filter images
• 🪆 Sort by the file size, date created and number of references
• 🔗 Read about Shopify's journey

As Shopify has scaled, our usage of illustrations in code has become fragmented across 6000+ repositories. We recently updated our illustration style and finding the illustrations, prioritising them, removing or updating them across our codebase was a challenge. We hope that @shopify/get-repo-images will be useful for anyone maintaining images at scale.

Status	Owner	Help
Experimental	@polaris-team	New issue

How to use

Make sure you have Node.js version 14 or later, then run this command from your terminal to to browse, sort and filter images from alex-page/alexpage.com.au on a Next.js website at http://localhost:3000

npx @shopify/get-repo-images -repo alex-page/alexpage.com.au

Create the files for a Next.js website into the ./repo-images-site directory

npx @shopify/get-repo-images -build -repo alex-page/alexpage.com.au

Note: If you want to run the website you can run cd repo-images-site && npm i && npm run dev

Generate a JSON file with results to ./images.json

npx @shopify/get-repo-images -json -repo alex-page/alexpage.com.au

Private repositories

Add a personal access token for private repositories. Replace TOKEN with your token.

npx @shopify/get-repo-images -repo alex-page/alexpage.com.au -token TOKEN

Advanced usage

Create a repos.config.json file and use the -config flag to access advanced options. These allow you to get the images from multiple repositories, specific image extensions or allow minimum image sizes.

npx @shopify/get-repo-images -config

{
  "repos": [
    {
      "repo": "shopify/mobile",
      "minSize": 1000,
      "extensions": ["webp"],
      "usageMatchers": ["drawable"],
      "usageNoExtension": true
    },
    {"repo": "alex-page/harmonograph.art"},
  ]
}

Technical details

@shopify/get-repo-images is built using the following technologies:

• go, a programming language https://golang.org/
• go-git, git implementation for go https://github.com/go-git/go-git
• Next.js, a react framework https://nextjs.org