{"id":26266103,"url":"https://github.com/calvin-ll/webpack-query-loader","last_synced_at":"2026-04-17T19:05:23.869Z","repository":{"id":37088934,"uuid":"270543708","full_name":"Calvin-LL/webpack-query-loader","owner":"Calvin-LL","description":"Run loaders depending on query","archived":false,"fork":false,"pushed_at":"2023-01-13T13:09:59.000Z","size":34491,"stargazers_count":2,"open_issues_count":26,"forks_count":1,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-12-29T23:23:52.842Z","etag":null,"topics":["conditional","loader","query","resourcequery","webpack"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","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/Calvin-LL.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2020-06-08T05:39:24.000Z","updated_at":"2023-04-11T15:30:07.000Z","dependencies_parsed_at":"2023-02-09T15:46:22.272Z","dependency_job_id":null,"html_url":"https://github.com/Calvin-LL/webpack-query-loader","commit_stats":null,"previous_names":["coolcyberbrain/webpack-query-loader"],"tags_count":21,"template":false,"template_full_name":null,"purl":"pkg:github/Calvin-LL/webpack-query-loader","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Calvin-LL%2Fwebpack-query-loader","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Calvin-LL%2Fwebpack-query-loader/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Calvin-LL%2Fwebpack-query-loader/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Calvin-LL%2Fwebpack-query-loader/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Calvin-LL","download_url":"https://codeload.github.com/Calvin-LL/webpack-query-loader/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Calvin-LL%2Fwebpack-query-loader/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":31941852,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-17T17:29:20.459Z","status":"ssl_error","status_checked_at":"2026-04-17T17:28:47.801Z","response_time":62,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.6:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"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":["conditional","loader","query","resourcequery","webpack"],"created_at":"2025-03-14T03:16:50.723Z","updated_at":"2026-04-17T19:05:23.848Z","avatar_url":"https://github.com/Calvin-LL.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# webpack-query-loader\n\n[![npm](https://img.shields.io/npm/v/webpack-query-loader?style=flat)](https://www.npmjs.com/package/webpack-query-loader) [![License: MIT](https://img.shields.io/badge/License-MIT-green.svg?style=flat)](https://opensource.org/licenses/MIT)\n\nRun loaders depending on the query string.\n\nIf you're trying to use `resourceQuery` in webpack v4 but it doesn't work as documented, you're in the right place. If you're using [webpack v5](https://github.com/webpack/webpack/issues/10552), use the built in `resourceQuery` instead of this loader\n\nThis loader is an attempt to solve problems like [this issue](https://github.com/webpack/webpack/issues/3497).\n\n## Install\n\nInstall with npm:\n\n```bash\nnpm install webpack-query-loader --save-dev\n```\n\nInstall with yarn:\n\n```bash\nyarn add webpack-query-loader --dev\n```\n\n## Usage\n\nAll query parameters (i.e. `?value=2`) will also be passed down to the loader in `use.loader`.\n\n```javascript\nimport png from \"./some_pic.png?inline\";\n```\n\n#### webpack.config.js\n\n```javascript\nmodule.exports = {\n  ...\n  module: {\n    rules: [\n      {\n        test: /\\.(png|jpe?g|svg)/i,\n        use: [\n          {\n            loader: \"webpack-query-loader\",\n            options: {\n              resourceQuery: \"inline\",\n              use: {\n                loader: \"url-loader\",\n              }\n            },\n          },\n          {\n            loader: \"webpack-query-loader\",\n            options: {\n              resourceQuery: \"!inline\",\n              use: {\n                loader: \"file-loader\",\n              }\n            },\n          },\n        ],\n      },\n    ],\n  },\n};\n\n```\n\n## Options\n\n|                 Name                  |             Type             |  Default  |                     Description                      |\n| :-----------------------------------: | :--------------------------: | :-------: | :--------------------------------------------------: |\n|           **[`use`](#use)**           |       `string\\|object`       | undefined |                  The loader to use                   |\n| **[`resourceQuery`](#resourcequery)** | `string\\|string[]\\|function` | undefined | The conditions that must match for the loader to run |\n\n### `use`\n\nThe `use` option can be in one of these formats\n\n```\nuse: \"loader-name\"\n```\n\nor\n\n```\nuse: {\n  loader: \"loader-name\",\n  options: {\n    someOption: true,\n  }\n}\n```\n\nor\n\n```\nuse: {\n  loader: \"loader-name\"\n}\n```\n\n### `resourceQuery`\n\nThe `resourceQuery` option can be in one of these formats\n\n```\nresourceQuery: \"run-me\" // only run the loader in `use` if the import has query parameter `run-me`\n```\n\nor\n\n```\nresourceQuery: \"!run-me\" // only run the loader in `use` if the import DOES NOT have query parameter `run-me`\n```\n\nor\n\n```\nresourceQuery: [\"run-me\", \"!dont-run-me\"] // only run the loader in `use` if the import has query parameter `run-me` AND no query parameter `dont-run-me`. For example \"./some_pic.png?run-me\" would work but \"./some_pic.png?run-me\u0026dont-run-me\" would not.\n```\n\nor\n\n```\n// resource is the whole import string e.g \"./some_pic.png?run-me\"\n// resourceQuery is the whole query string e.g \"?run-me\"\n// query is an object of the broken down query string e.g \"{ run-me: null }\"\n// query is empty (e.g. `{}`) if no query string exist in the import statement\n// returns true to run the loader, false to skip\n(resource, resourceQuery, query) =\u003e {\n  ...\n  return true;\n}\n```\n\n#### Notes:\n\nFor example, this query string `?height=10\u0026width=10\u0026resize` has query parameters `height`, `width`, and `resize`\n\nAn import statement without a query string is considered not to have any query parameter\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcalvin-ll%2Fwebpack-query-loader","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcalvin-ll%2Fwebpack-query-loader","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcalvin-ll%2Fwebpack-query-loader/lists"}