allen79yu/rollup-plugin-resource-query(opens in a new tab)
Language: JavaScript
a plugin to redirect resource query
- stars
- 2
- watchers
- 1
- forks
- 0
- open issues
- 0
- Last updated
- 03/07/2023
Language: JavaScript
a plugin to redirect resource query
a plugin to redirect resource query
It's a tiny rollup plugin to help redirect resourcQuery
Example
../static/svgs/icon.svg?url -> ../static/svgs/icon.svg
I use svgr to take care my svg resources. Webpack has a support of resourceQuery (link) but rollup didn't.
I am using both of them in my project so i write this plugin to help redirect the resourceQuery in rollup for svgr.
npm install rollup-plugin-resource-query -D
// or
yarn add rollup-plugin-resource-query -D
Just place it before the url() and svgr() plugins. Give it a resourceQuery option to target the query that need to be redirect.
The example below will redirect xx.svg?url to xx.svg
Example
import url from '@rollup/plugin-url' import svgr from '@svgr/rollup' import resourceQuery from 'rollup-plugin-resource-query' export default { plugins: [resourceQuery({ resourceQuery: 'url' }), url(), svgr()], input: 'src/main.js', output: { file: 'bundle.js', format: 'cjs', }, }
Then it's done. it should be work.
Example with custom redirect
import url from '@rollup/plugin-url' import svgr from '@svgr/rollup' import resourceQuery from 'rollup-plugin-resource-query' const redirect = (source) => { return `${source}&added` } export default { plugins: [resourceQuery({ resourceQuery: 'url', redirect }), url(), svgr()], input: 'src/main.js', output: { file: 'bundle.js', format: 'cjs', }, }
This example added a redirect option. You can customize the way you want if the default one is not enough for your usage.
this example will redirect tha path from xx.svg?url to xx.svg?url&added
| Key | Description | Type | isRequired | Default |
|---|---|---|---|---|
| resourceQuery | a string to match the target query to redirect. | String | Y | N/A |
| redirect | custom function to redirect. it will path the file path as a only parameter. just return the path you want to redirect. | function | N | redirect to the path without query. ex. xx.svg?resourceQuery -> xx.svg |