Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: merge attributes without tag and attributes with tag #408

Closed
Changes from 2 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
65 changes: 63 additions & 2 deletions README.md
Expand Up @@ -241,6 +241,69 @@ module.exports = {

If the tag name is not specified it will process all the tags.

**Note:** source with a `tag` option takes precedence over source without.

For example, to process `data-src` attributes on _all_ tags, omit the tag name:

**webpack.config.js**

```js
module.exports = {
module: {
rules: [
{
test: /\.html$/i,
loader: "html-loader",
options: {
sources: {
list: [
{
attribute: "data-src",
type: "src",
},
],
},
},
},
],
},
};
```

> ⚠ You **must** specify a tag name if using `...` to extend attributes for tags already in the default sources list

For example, to extend the default source list so that it also processes `data-src` attributes on _all_ tags, you might be tempted to do this:

```js
module.exports = {
module: {
rules: [
{
test: /\.html$/i,
loader: "html-loader",
options: {
sources: {
list: [
// All default supported tags and attributes
"...",
{
attribute: "data-src",
type: "src",
},
],
},
},
},
],
},
};
```

However this will only process `data-src` attributes on tags that _aren't in the default list_:

- `<p data-src="..">` will be processed, as `p` is not in the default sources list
- `<img data-src="..">` won't be processed, as `img` is already in the default sources list
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think it is bug, we need fix, attribute: "data-src" should process all tags have data-src


> You can use your custom filter to specify html elements to be processed.

For example:
Expand Down Expand Up @@ -320,8 +383,6 @@ module.exports = {
};
```

**Note:** source with a `tag` option takes precedence over source without.

Filter can be used to disable default sources.

For example:
Expand Down