{"id":23529747,"url":"https://github.com/jaid/modern-image-loader","last_synced_at":"2026-05-03T01:43:18.031Z","repository":{"id":57300469,"uuid":"233240214","full_name":"Jaid/modern-image-loader","owner":"Jaid","description":"Webpack loader that loads images as WebP with some neat extras.","archived":false,"fork":false,"pushed_at":"2023-03-03T18:17:17.000Z","size":2467,"stargazers_count":1,"open_issues_count":7,"forks_count":0,"subscribers_count":2,"default_branch":"main","last_synced_at":"2025-09-28T03:56:58.175Z","etag":null,"topics":["dom","image","img","loader","picture","react","react-dom","webpack","webpack-loader","webpack-plugin"],"latest_commit_sha":null,"homepage":"https://github.com/Jaid/modern-image-loader","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Jaid.png","metadata":{"files":{"readme":"readme.md","changelog":null,"contributing":null,"funding":".github/funding.yml","license":"license.txt","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},"funding":{"github":"Jaid","custom":"https://twitch.tv/products/jaidchen"}},"created_at":"2020-01-11T13:58:13.000Z","updated_at":"2023-03-10T09:05:29.000Z","dependencies_parsed_at":"2024-12-25T21:13:00.658Z","dependency_job_id":"793e96fd-0873-494d-8e0e-8f18d9253335","html_url":"https://github.com/Jaid/modern-image-loader","commit_stats":null,"previous_names":[],"tags_count":4,"template":false,"template_full_name":null,"purl":"pkg:github/Jaid/modern-image-loader","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Jaid%2Fmodern-image-loader","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Jaid%2Fmodern-image-loader/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Jaid%2Fmodern-image-loader/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Jaid%2Fmodern-image-loader/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Jaid","download_url":"https://codeload.github.com/Jaid/modern-image-loader/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Jaid%2Fmodern-image-loader/sbom","scorecard":{"id":69971,"data":{"date":"2025-08-11","repo":{"name":"github.com/Jaid/modern-image-loader","commit":"2a596907e8b42c7e6466c4e7d6ffd78d19e57d81"},"scorecard":{"version":"v5.2.1-40-gf6ed084d","commit":"f6ed084d17c9236477efd66e5b258b9d4cc7b389"},"score":2.5,"checks":[{"name":"Code-Review","score":0,"reason":"Found 0/22 approved changesets -- score normalized to 0","details":null,"documentation":{"short":"Determines if the project requires human code review before pull requests (aka merge requests) are merged.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#code-review"}},{"name":"Maintained","score":0,"reason":"0 commit(s) and 0 issue activity found in the last 90 days -- score normalized to 0","details":null,"documentation":{"short":"Determines if the project is \"actively maintained\".","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#maintained"}},{"name":"Dangerous-Workflow","score":10,"reason":"no dangerous workflow patterns detected","details":null,"documentation":{"short":"Determines if the project's GitHub Action workflows avoid dangerous patterns.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#dangerous-workflow"}},{"name":"Binary-Artifacts","score":10,"reason":"no binaries found in the repo","details":null,"documentation":{"short":"Determines if the project has generated executable (binary) artifacts in the source repository.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#binary-artifacts"}},{"name":"Packaging","score":-1,"reason":"packaging workflow not detected","details":["Warn: no GitHub/GitLab publishing workflow detected."],"documentation":{"short":"Determines if the project is published as a package that others can easily download, install, easily update, and uninstall.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#packaging"}},{"name":"Token-Permissions","score":0,"reason":"detected GitHub workflow tokens with excessive permissions","details":["Warn: no topLevel permission defined: .github/workflows/publishPackage.yml:1","Warn: no topLevel permission defined: .github/workflows/validate.yml:1","Info: no jobLevel write permissions found"],"documentation":{"short":"Determines if the project's workflows follow the principle of least privilege.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#token-permissions"}},{"name":"Pinned-Dependencies","score":0,"reason":"dependency not pinned by hash detected -- score normalized to 0","details":["Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/publishPackage.yml:10: update your workflow using https://app.stepsecurity.io/secureworkflow/Jaid/modern-image-loader/publishPackage.yml/main?enable=pin","Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/publishPackage.yml:12: update your workflow using https://app.stepsecurity.io/secureworkflow/Jaid/modern-image-loader/publishPackage.yml/main?enable=pin","Warn: third-party GitHubAction not pinned by hash: .github/workflows/publishPackage.yml:16: update your workflow using https://app.stepsecurity.io/secureworkflow/Jaid/modern-image-loader/publishPackage.yml/main?enable=pin","Warn: third-party GitHubAction not pinned by hash: .github/workflows/publishPackage.yml:20: update your workflow using https://app.stepsecurity.io/secureworkflow/Jaid/modern-image-loader/publishPackage.yml/main?enable=pin","Warn: third-party GitHubAction not pinned by hash: .github/workflows/publishPackage.yml:24: update your workflow using https://app.stepsecurity.io/secureworkflow/Jaid/modern-image-loader/publishPackage.yml/main?enable=pin","Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/validate.yml:10: update your workflow using https://app.stepsecurity.io/secureworkflow/Jaid/modern-image-loader/validate.yml/main?enable=pin","Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/validate.yml:12: update your workflow using https://app.stepsecurity.io/secureworkflow/Jaid/modern-image-loader/validate.yml/main?enable=pin","Warn: third-party GitHubAction not pinned by hash: .github/workflows/validate.yml:16: update your workflow using https://app.stepsecurity.io/secureworkflow/Jaid/modern-image-loader/validate.yml/main?enable=pin","Warn: third-party GitHubAction not pinned by hash: .github/workflows/validate.yml:18: update your workflow using https://app.stepsecurity.io/secureworkflow/Jaid/modern-image-loader/validate.yml/main?enable=pin","Warn: third-party GitHubAction not pinned by hash: .github/workflows/validate.yml:22: update your workflow using https://app.stepsecurity.io/secureworkflow/Jaid/modern-image-loader/validate.yml/main?enable=pin","Warn: third-party GitHubAction not pinned by hash: .github/workflows/validate.yml:26: update your workflow using https://app.stepsecurity.io/secureworkflow/Jaid/modern-image-loader/validate.yml/main?enable=pin","Info:   0 out of   4 GitHub-owned GitHubAction dependencies pinned","Info:   0 out of   7 third-party GitHubAction dependencies pinned"],"documentation":{"short":"Determines if the project has declared and pinned the dependencies of its build process.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#pinned-dependencies"}},{"name":"CII-Best-Practices","score":0,"reason":"no effort to earn an OpenSSF best practices badge detected","details":null,"documentation":{"short":"Determines if the project has an OpenSSF (formerly CII) Best Practices Badge.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#cii-best-practices"}},{"name":"Security-Policy","score":0,"reason":"security policy file not detected","details":["Warn: no security policy file detected","Warn: no security file to analyze","Warn: no security file to analyze","Warn: no security file to analyze"],"documentation":{"short":"Determines if the project has published a security policy.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#security-policy"}},{"name":"Fuzzing","score":0,"reason":"project is not fuzzed","details":["Warn: no fuzzer integrations found"],"documentation":{"short":"Determines if the project uses fuzzing.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#fuzzing"}},{"name":"License","score":10,"reason":"license file detected","details":["Info: project has a license file: license.txt:0","Info: FSF or OSI recognized license: MIT License: license.txt:0"],"documentation":{"short":"Determines if the project has defined a license.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#license"}},{"name":"Signed-Releases","score":-1,"reason":"no releases found","details":null,"documentation":{"short":"Determines if the project cryptographically signs release artifacts.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#signed-releases"}},{"name":"Branch-Protection","score":0,"reason":"branch protection not enabled on development/release branches","details":["Warn: branch protection not enabled for branch 'main'"],"documentation":{"short":"Determines if the default and release branches are protected with GitHub's branch protection settings.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#branch-protection"}},{"name":"SAST","score":0,"reason":"SAST tool is not run on all commits -- score normalized to 0","details":["Warn: 0 commits out of 14 are checked with a SAST tool"],"documentation":{"short":"Determines if the project uses static code analysis.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#sast"}},{"name":"Vulnerabilities","score":0,"reason":"159 existing vulnerabilities detected","details":["Warn: Project is vulnerable to: GHSA-968p-4wvh-cqc8","Warn: Project is vulnerable to: GHSA-67hx-6x53-jw92","Warn: Project is vulnerable to: GHSA-6chw-6frg-f759","Warn: Project is vulnerable to: GHSA-v88g-cgmw-v5xw","Warn: Project is vulnerable to: GHSA-whgm-jr23-g3j9","Warn: Project is vulnerable to: GHSA-93q8-gq69-wqmw","Warn: Project is vulnerable to: GHSA-fwr7-v2mv-hh25","Warn: Project is vulnerable to: GHSA-4w2v-q235-vp99","Warn: Project is vulnerable to: GHSA-cph5-m8f7-6c5x","Warn: Project is vulnerable to: GHSA-wf5p-g6vw-rhxx","Warn: Project is vulnerable to: GHSA-jr5f-v2jv-69x6","Warn: Project is vulnerable to: GHSA-pp7h-53gx-mx7r","Warn: Project is vulnerable to: GHSA-qwcr-r2fm-qrc7","Warn: Project is vulnerable to: GHSA-v6h2-p8h4-qcjw","Warn: Project is vulnerable to: GHSA-grv7-fg5c-xmjg","Warn: Project is vulnerable to: GHSA-x9w5-v3q2-3rhw","Warn: Project is vulnerable to: GHSA-w8qv-6jwh-64r5","Warn: Project is vulnerable to: GHSA-257v-vj4p-3w2h","Warn: Project is vulnerable to: GHSA-pxg6-pf52-xh8x","Warn: Project is vulnerable to: GHSA-3xgq-45jj-v275","Warn: Project is vulnerable to: GHSA-gxpj-cx7g-858c","Warn: Project is vulnerable to: GHSA-w573-4hg7-7wgq","Warn: Project is vulnerable to: GHSA-qgfr-5hqp-vrw9","Warn: Project is vulnerable to: GHSA-3wcq-x3mq-6r9p","Warn: Project is vulnerable to: GHSA-ff7x-qrg7-qggm","Warn: Project is vulnerable to: GHSA-r7jx-5m6m-cpg9","Warn: Project is vulnerable to: GHSA-phwq-j96m-2c2q","Warn: Project is vulnerable to: GHSA-ghr5-ch3p-vcr6","Warn: Project is vulnerable to: GHSA-vh7m-p724-62c2","Warn: Project is vulnerable to: GHSA-r9p9-mrjm-926w","Warn: Project is vulnerable to: GHSA-434g-2637-qmqr","Warn: Project is vulnerable to: GHSA-49q7-c7j4-3p7m","Warn: Project is vulnerable to: GHSA-977x-g7h5-7qgw","Warn: Project is vulnerable to: GHSA-f7q4-pwc6-w24p","Warn: Project is vulnerable to: GHSA-fc9h-whq2-v747","Warn: Project is vulnerable to: GHSA-vjh7-7g9h-fjfh","Warn: Project is vulnerable to: GHSA-j4f2-536g-r55m","Warn: Project is vulnerable to: GHSA-r7qp-cfhv-p84w","Warn: Project is vulnerable to: GHSA-4gmj-3p3h-gm8h","Warn: Project is vulnerable to: GHSA-6h5x-7c5m-7cr7","Warn: Project is vulnerable to: GHSA-rv95-896h-c2vc","Warn: Project is vulnerable to: GHSA-qw6h-vgh9-j6wx","Warn: Project is vulnerable to: GHSA-x3cc-x39p-42qx","Warn: Project is vulnerable to: GHSA-74fj-2j2h-c42q","Warn: Project is vulnerable to: GHSA-pw2r-vq6v-hr8c","Warn: Project is vulnerable to: GHSA-jchw-25xp-jwwc","Warn: Project is vulnerable to: GHSA-cxjh-pqwp-8mfp","Warn: Project is vulnerable to: GHSA-fjxv-7rqg-78g4","Warn: Project is vulnerable to: GHSA-ww39-953v-wcq6","Warn: Project is vulnerable to: GHSA-pfrx-2q88-qq97","Warn: Project is vulnerable to: GHSA-765h-qjxv-5f44","Warn: Project is vulnerable to: GHSA-f2jv-r9rf-7988","Warn: Project is vulnerable to: GHSA-43f8-2h32-f4cj","Warn: Project is vulnerable to: GHSA-rc47-6667-2j5j","Warn: Project is vulnerable to: GHSA-6x33-pw7p-hmpq","Warn: Project is vulnerable to: GHSA-c7qv-q95q-8v27","Warn: Project is vulnerable to: GHSA-qqgx-2p2h-9c37","Warn: Project is vulnerable to: GHSA-78xj-cgh5-2h22","Warn: Project is vulnerable to: GHSA-2p57-rm9w-gvfp","Warn: Project is vulnerable to: GHSA-7r28-3m3f-r2pr","Warn: Project is vulnerable to: GHSA-r8j5-h5cx-65gg","Warn: Project is vulnerable to: GHSA-w7q9-p3jq-fmhm","Warn: Project is vulnerable to: GHSA-xvf7-4v9q-58w6","Warn: Project is vulnerable to: GHSA-896r-f27r-55mw","Warn: Project is vulnerable to: GHSA-9c47-m6qq-7p4h","Warn: Project is vulnerable to: GHSA-6c8f-qphg-qjgp","Warn: Project is vulnerable to: GHSA-76p3-8jx3-jpfq","Warn: Project is vulnerable to: GHSA-3rfm-jhwj-7488","Warn: Project is vulnerable to: GHSA-hhq3-ff78-jv3g","Warn: Project is vulnerable to: GHSA-p6mc-m468-83gw","Warn: Project is vulnerable to: GHSA-29mw-wpgm-hmr9","Warn: Project is vulnerable to: GHSA-35jh-r3h4-6jhm","Warn: Project is vulnerable to: GHSA-6vfc-qv3f-vr6c","Warn: Project is vulnerable to: GHSA-5v2h-r2cx-5xgj","Warn: Project is vulnerable to: GHSA-rrrm-qjm4-v8hf","Warn: Project is vulnerable to: GHSA-952p-6rrq-rcjv","Warn: Project is vulnerable to: GHSA-f8q6-p94x-37v3","Warn: Project is vulnerable to: GHSA-vh95-rmgr-6w4m","Warn: Project is vulnerable to: GHSA-xvch-5gv4-984h","Warn: Project is vulnerable to: GHSA-92xj-mqp7-vmcj","Warn: Project is vulnerable to: GHSA-wxgw-qj99-44c2","Warn: Project is vulnerable to: GHSA-5rrq-pxf6-6jx5","Warn: Project is vulnerable to: GHSA-8fr3-hfg3-gpgp","Warn: Project is vulnerable to: GHSA-gf8q-jrpm-jvxq","Warn: Project is vulnerable to: GHSA-2r2c-g63r-vccr","Warn: Project is vulnerable to: GHSA-cfm4-qjh2-4765","Warn: Project is vulnerable to: GHSA-x4jg-mjrx-434g","Warn: Project is vulnerable to: GHSA-5fw9-fq32-wv5p","Warn: Project is vulnerable to: GHSA-r8f7-9pfq-mjmv","Warn: Project is vulnerable to: GHSA-px4h-xg32-q955","Warn: Project is vulnerable to: GHSA-rp65-9cf3-cjxr","Warn: Project is vulnerable to: GHSA-cwx2-736x-mf6w","Warn: Project is vulnerable to: GHSA-v39p-96qg-c8rf","Warn: Project is vulnerable to: GHSA-8v63-cqqc-6r2c","Warn: Project is vulnerable to: GHSA-76c9-3jph-rj3q","Warn: Project is vulnerable to: GHSA-6fx8-h7jm-663j","Warn: Project is vulnerable to: GHSA-hj48-42vr-x3v9","Warn: Project is vulnerable to: GHSA-9wv6-86v2-598j","Warn: Project is vulnerable to: GHSA-rhx6-c78j-4q9w","Warn: Project is vulnerable to: GHSA-h7cp-r72f-jxh6","Warn: Project is vulnerable to: GHSA-v62p-rq8g-8h59","Warn: Project is vulnerable to: GHSA-x565-32qp-m3vf","Warn: Project is vulnerable to: GHSA-566m-qj78-rww5","Warn: Project is vulnerable to: GHSA-7fh5-64p2-3v2j","Warn: Project is vulnerable to: GHSA-hwj9-h5mp-3pm3","Warn: Project is vulnerable to: GHSA-p493-635q-r6gr","Warn: Project is vulnerable to: GHSA-3965-hpx2-q597","Warn: Project is vulnerable to: GHSA-hrpp-h998-j3pp","Warn: Project is vulnerable to: GHSA-p8p7-x288-28g6","Warn: Project is vulnerable to: GHSA-7mwh-4pqv-wmr8","Warn: Project is vulnerable to: GHSA-c2qf-rxjj-qqgw","Warn: Project is vulnerable to: GHSA-44c6-4v22-4mhx","Warn: Project is vulnerable to: GHSA-4x5v-gmq8-25ch","Warn: Project is vulnerable to: GHSA-m6fv-jmcg-4jfg","Warn: Project is vulnerable to: GHSA-hxcc-f52p-wc94","Warn: Project is vulnerable to: GHSA-cm22-4g7w-348p","Warn: Project is vulnerable to: GHSA-fxwf-4rqh-v8g3","Warn: Project is vulnerable to: GHSA-25hc-qcg6-38wj","Warn: Project is vulnerable to: GHSA-xfhh-g9f5-x4m4","Warn: Project is vulnerable to: GHSA-qm95-pgcg-qqfq","Warn: Project is vulnerable to: GHSA-cqmj-92xf-r6r9","Warn: Project is vulnerable to: GHSA-c9g6-9335-x697","Warn: Project is vulnerable to: GHSA-vx3p-948g-6vhq","Warn: Project is vulnerable to: GHSA-mxhp-79qh-mcx6","Warn: Project is vulnerable to: GHSA-3jfq-g458-7qm9","Warn: Project is vulnerable to: GHSA-5955-9wpr-37jh","Warn: Project is vulnerable to: GHSA-f5x3-32g6-xq36","Warn: Project is vulnerable to: GHSA-r628-mhmh-qjhw","Warn: Project is vulnerable to: GHSA-9r2w-394v-53qc","Warn: Project is vulnerable to: GHSA-qq89-hq3f-393p","Warn: Project is vulnerable to: GHSA-4wf5-vphf-c2xc","Warn: Project is vulnerable to: GHSA-52f5-9888-hmc6","Warn: Project is vulnerable to: GHSA-jgrx-mgxx-jf9v","Warn: Project is vulnerable to: GHSA-72xf-g2v4-qvf3","Warn: Project is vulnerable to: GHSA-7p7h-4mm5-852v","Warn: Project is vulnerable to: GHSA-662x-fhqg-9p8v","Warn: Project is vulnerable to: GHSA-394c-5j6w-4xmx","Warn: Project is vulnerable to: GHSA-78cj-fxph-m83p","Warn: Project is vulnerable to: GHSA-fhg7-m89q-25r3","Warn: Project is vulnerable to: GHSA-cf4h-3jhx-xvhq","Warn: Project is vulnerable to: GHSA-9m6j-fcg5-2442","Warn: Project is vulnerable to: GHSA-hh27-ffr2-f2jc","Warn: Project is vulnerable to: GHSA-rqff-837h-mm52","Warn: Project is vulnerable to: GHSA-8v38-pw62-9cw2","Warn: Project is vulnerable to: GHSA-hgjh-723h-mx2j","Warn: Project is vulnerable to: GHSA-jf5r-8hm2-f872","Warn: Project is vulnerable to: GHSA-g3ch-rx76-35fx","Warn: Project is vulnerable to: GHSA-wr3j-pwj9-hqq6","Warn: Project is vulnerable to: GHSA-4v9v-hfq4-rm2v","Warn: Project is vulnerable to: GHSA-9jgg-88mc-972h","Warn: Project is vulnerable to: GHSA-g78m-2chm-r7qv","Warn: Project is vulnerable to: GHSA-j8xg-fqg3-53r7","Warn: Project is vulnerable to: GHSA-3h5v-q93c-6h6q","Warn: Project is vulnerable to: GHSA-6fc8-4gx4-v693","Warn: Project is vulnerable to: GHSA-776f-qx25-q3cc","Warn: Project is vulnerable to: GHSA-72mh-269x-7mh5","Warn: Project is vulnerable to: GHSA-h4j5-c7cj-74xg","Warn: Project is vulnerable to: GHSA-c4w7-xm78-47vh","Warn: Project is vulnerable to: GHSA-p9pc-299p-vxgp"],"documentation":{"short":"Determines if the project has open, known unfixed vulnerabilities.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#vulnerabilities"}}]},"last_synced_at":"2025-08-15T03:38:03.439Z","repository_id":57300469,"created_at":"2025-08-15T03:38:03.439Z","updated_at":"2025-08-15T03:38:03.439Z"},"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":279013887,"owners_count":26085325,"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","status":"online","status_checked_at":"2025-10-12T02:00:06.719Z","response_time":53,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"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":["dom","image","img","loader","picture","react","react-dom","webpack","webpack-loader","webpack-plugin"],"created_at":"2024-12-25T21:12:52.871Z","updated_at":"2025-10-13T01:19:56.448Z","avatar_url":"https://github.com/Jaid.png","language":"JavaScript","funding_links":["https://github.com/sponsors/Jaid","https://twitch.tv/products/jaidchen","https://github.com/sponsors/jaid"],"categories":[],"sub_categories":[],"readme":"# modern-image-loader\n\n\n\u003ca href=\"https://raw.githubusercontent.com/jaid/modern-image-loader/master/license.txt\"\u003e\u003cimg src=\"https://img.shields.io/github/license/jaid/modern-image-loader?style=flat-square\" alt=\"License\"/\u003e\u003c/a\u003e \u003ca href=\"https://github.com/sponsors/jaid\"\u003e\u003cimg src=\"https://img.shields.io/badge/\u003c3-Sponsor-FF45F1?style=flat-square\" alt=\"Sponsor modern-image-loader\"/\u003e\u003c/a\u003e  \n\u003ca href=\"https://actions-badge.atrox.dev/jaid/modern-image-loader/goto\"\u003e\u003cimg src=\"https://img.shields.io/endpoint.svg?style=flat-square\u0026url=https%3A%2F%2Factions-badge.atrox.dev%2Fjaid%2Fmodern-image-loader%2Fbadge\" alt=\"Build status\"/\u003e\u003c/a\u003e \u003ca href=\"https://github.com/jaid/modern-image-loader/commits\"\u003e\u003cimg src=\"https://img.shields.io/github/commits-since/jaid/modern-image-loader/v1.1.1?style=flat-square\u0026logo=github\" alt=\"Commits since v1.1.1\"/\u003e\u003c/a\u003e \u003ca href=\"https://github.com/jaid/modern-image-loader/commits\"\u003e\u003cimg src=\"https://img.shields.io/github/last-commit/jaid/modern-image-loader?style=flat-square\u0026logo=github\" alt=\"Last commit\"/\u003e\u003c/a\u003e \u003ca href=\"https://github.com/jaid/modern-image-loader/issues\"\u003e\u003cimg src=\"https://img.shields.io/github/issues/jaid/modern-image-loader?style=flat-square\u0026logo=github\" alt=\"Issues\"/\u003e\u003c/a\u003e  \n\u003ca href=\"https://npmjs.com/package/modern-image-loader\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/modern-image-loader?style=flat-square\u0026logo=npm\u0026label=latest%20version\" alt=\"Latest version on npm\"/\u003e\u003c/a\u003e \u003ca href=\"https://github.com/jaid/modern-image-loader/network/dependents\"\u003e\u003cimg src=\"https://img.shields.io/librariesio/dependents/npm/modern-image-loader?style=flat-square\u0026logo=npm\" alt=\"Dependents\"/\u003e\u003c/a\u003e \u003ca href=\"https://npmjs.com/package/modern-image-loader\"\u003e\u003cimg src=\"https://img.shields.io/npm/dm/modern-image-loader?style=flat-square\u0026logo=npm\" alt=\"Downloads\"/\u003e\u003c/a\u003e\n\n**Webpack loader that outputs optimized WebP images with JPEG/PNG fallback and other neat extras.**\n\n\nSee [w3schools - `\u003cpicture\u003e` tag](https://www.w3schools.com/tags/tag_picture.asp) to get an idea of when this loader can be useful.\n\n\n## Installation\n\n\u003ca href=\"https://npmjs.com/package/modern-image-loader\"\u003e\u003cimg src=\"https://img.shields.io/badge/npm-modern--image--loader-C23039?style=flat-square\u0026logo=npm\" alt=\"modern-image-loader on npm\"/\u003e\u003c/a\u003e\n\n```bash\nnpm install --save-dev modern-image-loader@^1.1.1\n```\n\n\u003ca href=\"https://yarnpkg.com/package/modern-image-loader\"\u003e\u003cimg src=\"https://img.shields.io/badge/Yarn-modern--image--loader-2F8CB7?style=flat-square\u0026logo=yarn\u0026logoColor=white\" alt=\"modern-image-loader on Yarn\"/\u003e\u003c/a\u003e\n\n```bash\nyarn add --dev modern-image-loader@^1.1.1\n```\n\n\u003ca href=\"https://github.com/jaid/modern-image-loader/packages\"\u003e\u003cimg src=\"https://img.shields.io/badge/GitHub Packages-@jaid/modern--image--loader-24282e?style=flat-square\u0026logo=github\" alt=\"@jaid/modern-image-loader on GitHub Packages\"/\u003e\u003c/a\u003e  \n(if [configured properly](https://help.github.com/en/github/managing-packages-with-github-packages/configuring-npm-for-use-with-github-packages))\n\n```bash\nnpm install --save-dev @jaid/modern-image-loader@^1.1.1\n```\n\n\n\n\n\n## Usage\n\nAdd the loader to your Webpack config:\n\n`webpack.config.js`\n```javascript\nmodule.exports = {\n  module: {\n    rules: [\n      {\n        test: /\\.(png|jpg|jpeg)$/,\n        use: \"modern-image-loader\"\n      }\n    ]\n  }\n}\n```\n\nNow you can import corresponding files in your entry script:\n\n`index.js`\n```javascript\nimport image from \"./dog.jpeg\"\n\nconsole.log(image)\n```\n\n## Advanced Usage\n\n### React Example\n\nThe default returned object makes it easy to be used in frameworks like React.\n\n`index.js`\n```javascript\nimport React from \"react\"\nimport ReactDom from \"react-dom\"\n\nimport image from \"./dog.jpeg?alt=Dog\"\n\nReactDom.render(\u003cdiv className=\"main\"\u003e\n  \u003cpicture\u003e\n    \u003csource {...image.webp}/\u003e\n    \u003csource {...image.fallback}/\u003e\n    \u003cimg {...image.img}/\u003e\n  \u003c/picture\u003e\n\u003c/div\u003e, document.body)\n```\n\nThis will render a DOM like this:\n\n```html\n\u003cbody\u003e\n  \u003cdiv class=\"main\"\u003e\n    \u003cpicture\u003e\n      \u003csource srcset=\"dog.webp\" type=\"image/webp\" /\u003e\n      \u003csource srcset=\"dog.jpeg\" type=\"image/jpeg\" /\u003e\n      \u003cimg src=\"dog.jpeg\" alt=\"Dog\" /\u003e\n    \u003c/picture\u003e\n  \u003c/div\u003e\n\u003c/body\u003e\n```\n\n### Export types\n\nWhat `image` will be in `import image from \"./dog.jpeg\"`, depends on the chosen export type. It is `dom` by default.\n\n#### dom\n\n```javascript\n{\n  webp: {\n    srcset: \"dog.webp\",\n    type: \"image/webp\"\n  },\n  fallback: {\n    srcset: \"dog.jpeg\",\n    type: \"image/jpeg\"\n  },\n  img: {\n    src: \"dog.jpeg\",\n    alt: \"Dog\"\n  }\n}\n```\n\n#### fallbackPath\n\n```javascript\n\"dog.jpeg\"\n```\n\n#### paths\n\n```javascript\n{\n  webp: \"dog.webp\",\n  fallback: \"dog.jpeg\"\n}\n```\n\n## Options\n\nOption|Default|Description\n---|---|---\nalt||Value for `alt` tag\nexport|`domProperties`|Format of returned JavaScript value. Valid formats: `dom`, `fallbackPath`, `paths`\nfallbackFileName|`[hash:base64:6]`|Output file name. Can use webpack-specific placeholders. `[ext]` will be based on input file type.\ninputMime|auto|Mime type of input file. You probably do not want to set this, as it is automatically determined based on input file extension.\njpegtran|`{}`|[`imagemin-jpegtran`](https://www.npmjs.com/package/imagemin-jpegtran) options\npngquant|`{strip: true}`|[`imagemin-pngquant`](https://www.npmjs.com/package/imagemin-pngquant) options\npublicPath|as defined in Webpack config|Public path that is added to the front of file names in returned JavaScript value.\nwebp|`{quality: 95, nearLossless: 50, sharpness: 5}`|[`imagemin-webp`](https://www.npmjs.com/package/imagemin-webp) options\nwebpFileName|`[hash:base64:6]`|Output file name. Can use webpack-specific placeholders. `[ext]` will be \"webp\".\n\nAll options can be overwritten in any asset import by appending a query string.\n\n\n\n\n\n\n\n## Development\n\n\n\nSetting up:\n```bash\ngit clone git@github.com:jaid/modern-image-loader.git\ncd modern-image-loader\nnpm install\n```\nTesting:\n```bash\nnpm run test:dev\n```\nTesting in production environment:\n```bash\nnpm run test\n```\n\n\n## License\n```text\nMIT License\n\nCopyright © 2020, Jaid \u003cjaid.jsx@gmail.com\u003e (github.com/jaid)\n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\nSOFTWARE.\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjaid%2Fmodern-image-loader","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fjaid%2Fmodern-image-loader","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjaid%2Fmodern-image-loader/lists"}