0.1.3 • Published 3 years ago
svelte-html-asset-preprocessor v0.1.3
svelte-html-asset-preprocessor
Transform html asset relative path. It works with snowpack & webpack 5.
e.g.
before:
<img src="foo.png">
after:
<img src="{new URL('foo.png', import.meta.url)}">
Usage
svelte.config.js:
const htmlAssetPreprocessor = require('svelte-html-asset-preprocessor');
module.exports = {
preprocess: [
htmlAssetPreprocessor()
]
};
Options
htmlAssetPreprocessor({ rules, filter })
rules
Array
. Add custom rules. Build-in rules:
const defaultRules = [
{
tag: 'img',
attribute: 'src',
type: 'src'
},
{
tag: 'img',
attribute: 'srcset',
type: 'srcset'
},
{
tag: 'input',
attribute: 'src',
type: 'src'
},
{
tag: 'audio',
attribute: 'src',
type: 'src'
},
{
tag: 'video',
attribute: 'src',
type: 'src'
},
{
tag: 'video',
attribute: 'poster',
type: 'src'
},
{
tag: 'source',
attribute: 'src',
type: 'src'
},
{
tag: 'source',
attribute: 'srcset',
type: 'srcset'
},
{
tag: 'track',
attribute: 'src',
type: 'src'
},
{
tag: 'link',
attribute: 'href',
type: 'src'
},
{
tag: 'object',
attribute: 'data',
type: 'src'
},
{
tag: 'embed',
attribute: 'src',
type: 'src'
}
];
filter
filter(path) -> Boolean
Filter the path. Return true
to transform, or return false
to skip the path.
Transform css url()
Use https://github.com/canadaduane/snowpack-plugin-relative-css-urls