{"id":13479640,"url":"https://github.com/rossmoody/svg-gobbler","last_synced_at":"2025-05-15T02:09:40.016Z","repository":{"id":36037424,"uuid":"167493223","full_name":"rossmoody/svg-gobbler","owner":"rossmoody","description":"Open source browser extension for finding, editing, exporting, optimizing, and managing SVG content.","archived":false,"fork":false,"pushed_at":"2025-05-09T20:23:40.000Z","size":32082,"stargazers_count":909,"open_issues_count":12,"forks_count":36,"subscribers_count":11,"default_branch":"main","last_synced_at":"2025-05-09T20:28:38.122Z","etag":null,"topics":["chrome-extension","extension","firefox-addon","icon","icons","inline-svg","javascript","svg","svg-export","svg-icons","svgo","svgr","typescript"],"latest_commit_sha":null,"homepage":"https://www.svggobbler.com","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"apache-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/rossmoody.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2019-01-25T05:57:43.000Z","updated_at":"2025-05-07T17:35:46.000Z","dependencies_parsed_at":"2024-01-21T22:35:56.982Z","dependency_job_id":"8d6684af-8cd2-4762-a46a-86ddc2f407c8","html_url":"https://github.com/rossmoody/svg-gobbler","commit_stats":{"total_commits":451,"total_committers":12,"mean_commits":"37.583333333333336","dds":0.1374722838137472,"last_synced_commit":"9b468dcee0fdb134402290f2516f8dfca54eba85"},"previous_names":[],"tags_count":31,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rossmoody%2Fsvg-gobbler","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rossmoody%2Fsvg-gobbler/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rossmoody%2Fsvg-gobbler/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rossmoody%2Fsvg-gobbler/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/rossmoody","download_url":"https://codeload.github.com/rossmoody/svg-gobbler/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":254259384,"owners_count":22040820,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["chrome-extension","extension","firefox-addon","icon","icons","inline-svg","javascript","svg","svg-export","svg-icons","svgo","svgr","typescript"],"created_at":"2024-07-31T16:02:20.662Z","updated_at":"2025-05-15T02:09:40.010Z","avatar_url":"https://github.com/rossmoody.png","language":"TypeScript","funding_links":[],"categories":["TypeScript","Others"],"sub_categories":[],"readme":"\u003cdiv align=\"center\"\u003e\n \u003ca href=\"https://svggobbler.com\"\u003e\n  \u003cimg src=\"assets/local/read-me.png\"\u003e\n \u003c/a\u003e\n \u003cbr\u003e\n\u003c/div\u003e\n\n## 🚀 Where to install\n\nThis extension is available on:\n\n- [Chrome Web store](https://chrome.google.com/webstore/detail/svg-gobbler/mpbmflcodadhgafbbakjeahpandgcbch)\n- [Firefox Addon Marketplace](https://addons.mozilla.org/firefox/addon/svg-gobbler/)\n\n\u003cdiv align=\"center\"\u003e\n \u003ca href=\"https://svggobbler.com\"\u003e\n  \u003cimg src=\"assets/local/gobbler-screenshot.png\"\u003e\n \u003c/a\u003e\n \u003cbr\u003e\n\u003c/div\u003e\n\n## Features\n\nSVG Gobbler is a browser extension that finds the SVG content in your current tab and lets you\noptimize, download, copy, edit, or export.\n\n### Find SVGs\n\n- Quickly find SVGs from a site by various `mime` types\n- Handle CORs restricted SVGs\n- Find and rebuild individual sprite SVG instances\n\n### Export SVGs\n\n- Create SVG Sprites from a collection of icons\n- Export as SVG, PNG, WEBP, JPEG and various other formats\n- Transform SVGs into minified Data URIs\n- Transform SVGs into React components with SVGR\n- Optimize and minify SVGs with SVGO\n\n### Organize SVGs\n\n- Group and categorize SVGs by their primary domain or custom collection name\n- Move, copy, duplicate, and optimize icons before sharing\n- Save and store a set of uploaded SVGs for optimization\n\n## Local development\n\nBefore making edits you will need to build the extension locally and side load it as a developer\nextension to test any changes.\n\n### 1. Clone the repo\n\nClone the repo to your local machine and navigate into the root directory.\n\n```shell\ncd svg-gobbler\n```\n\n### 2. Install dependencies\n\nSVG Gobbler uses pnpm to build the necessary dependencies.\n\n```shell\npnpm i\n```\n\n### 3. Start and watch a build\n\nOn the initial build of the extension, you will need to build the assets for the bundle.\n\n```bash\npnpm start\n```\n\nThis will build the assets to the `dist` folder and watch for changes. For subsequent builds you\nonly need to run:\n\n```bash\npnpm dev\n```\n\n### 4. Start the server (optional)\n\nMost functionality works without a server, but if you want to make local fetch calls, open a\nseparate terminal, navigate to the `server` directory, and start the server from there.\n\n```bash\ncd server\n```\n\nInstall the necessary dependencies\n\n```bash\npnpm i\n```\n\nFrom this directory, compile the server function to the `dist` folder.\n\n```bash\npnpm build\n```\n\nIn a separate terminal session serve the function on a local server.\n\n```bash\npnpm serve\n```\n\nThis will startup the server and restart it any time a change is recompiled.\n\n## Build for Firefox\n\nTo build the extension for Firefox, the manifest needs manually revised with a build script. First\nrun:\n\n### 1. Build a release\n\n```bash\npnpm release\n```\n\nThis will build a loadable zip file in the `releases` directory.\n\n### 2. Launch the extension\n\n```bash\npnpm dev-ff\n```\n\nThis will build the extension loaded within an instance of Firefox. It will automatically be updated\nas you build new version.\n\n### 3. Rebuild on changes\n\nFor now the extension must be rebuilt with CLI to see changes reflected in Firefox.\n\n```bash\npnpm release\n```\n\n## Loading the Extension\n\n### 1. Open the extensions page in your browser\n\nTo load the extension, open the extensions area within your browser by navigating to\n`chrome://extensions`\n\n### 2. Enable \"Developer mode\"\n\nClick the toggle in the top right of the screen to enable developer mode.\n\n### 3. Load the extnesion\n\nClick \"Load unpacked\", and choose the `dist` folder\n\nWhen you make changes in src the background script and any content script will reload automatically.\n\n## About\n\n5 major versions and 7+ years ago, this started as a pet project to improve the\n[SVG Crowbar](https://github.com/nytimes/svg-crowbar) tool that is no longer being maintained by NY\nTimes.\n\n### Powered by\n\nThis project benefits from some incredibly talented folks.\n\n- [Vite](https://vitejs.dev/): Frontend tooling and build processes\n- [CRXJS](https://github.com/crxjs/chrome-extension-tools): Chrome extension build automation\n- [Tailwind CSS](https://tailwindcss.com/): CSS styling around the app\n- [SVGR](https://react-svgr.com/): SVG to React component transformation\n- [SVGO](https://github.com/svg/svgo): SVG optimization scripts\n- [Codemirror](https://codemirror.net/): Extensible code editor\n- [Radix UI](https://www.radix-ui.com/): Accessible component library primitives\n- [JSZip](https://stuk.github.io/jszip/): Zipping files for download\n- [Mini SVG Data URI](https://github.com/tigt/mini-svg-data-uri): Minify SVG data URIs\n- [React Router](https://reactrouter.com/en/main): App routing\n- [DND-Kit](https://dndkit.com/): Drag and drop functionality\n\n### Open source\n\nThis extension is open source and doesn't collect any information from users. It's free, and made\navailable because I enjoy making useful things for the web. Please consider contributing with an\nidea, bug fix, or feature request.\n\n---\n\n## More apps by me\n\nI like making things. [Check out what I'm up to lately](https://rossmoody.com).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frossmoody%2Fsvg-gobbler","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Frossmoody%2Fsvg-gobbler","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frossmoody%2Fsvg-gobbler/lists"}