webpack-contrib / html-loader

HTML Loader
MIT License
1.17k stars 205 forks source link

Supports more attributes #259

Open alexander-akait opened 4 years ago

alexander-akait commented 4 years ago

Feature Proposal

Supports more attributes:

Feature Use Case

0CJS

benjaminpreiss commented 4 years ago

I would like to nominate the video tag poster attribute for this list of attributes!

I stumbled upon it today when trying to use videojs... Wouldn't it be possible to allow custom named attributes? E.g.:

loader: "html-loader",
options: {
    attributes: {
      list: [
        {
          tag: 'video',
          attribute: 'poster',
          type: 'src'
        },
      ],
    },
}
alexander-akait commented 4 years ago

https://github.com/webpack-contrib/html-loader#object

alexander-akait commented 4 years ago

We already support the poster attribute for video tag, check your version of html-loader

benjaminpreiss commented 4 years ago

Ah sorry for the mistake. :/

GuillermoCasanova commented 4 years ago

Is there support for data-srcset on source? Just submitted an issue for this. #316

alexander-akait commented 4 years ago

@GuillermoCasanova It is non standard, other developers can have any data in this, you need to use options for this, the only way I can help here allow to define list of attributes in easy way:

{ 
 list: [
  // Means all default attributes
  '...', 
  {  
    tag: 'img',
    attribute: 'data-srcset',
    type: 'srcset',
  }
 ] 
}
bigskillet commented 4 years ago
  • link:rel=icon:href
  • meta:msapplication-TileImage
  • meta:msapplication-config
  • link:rel=mask-icon:href
  • link:rel=apple-touch-icon:href
  • link:rel=apple-touch-icon-precomposed:href
  • link:rel=apple-touch-startup-image:href
  • link:rel=manifest:href
  • link:rel=shortcut icon:href
  • style - parse url() in CSS

Having these attributes as default would be awesome and especially useful since the interpolate option has been removed. In the meantime, is there some way to add these attributes manually?

alexander-akait commented 4 years ago

I think it is easy to implement, feel free to send a PR

bigskillet commented 3 years ago

Sorry, I'm not that good at javascript, so it wouldn't be that easy for me to include these attributes. I pulled it down and made an attempt, but didn't have much luck. In the meantime, is there some way to manually add these attributes using the list tag filter? I haven't had much luck with that either.

alexander-akait commented 3 years ago

WIP on this, release will be tomorrow after tomorrow

elliotleelewis commented 3 years ago

@alexander-akait Just curious if you have any timeline on getting this implemented? 😃

alexander-akait commented 3 years ago

@elliotleelewis What is attribute you need?

elliotleelewis commented 3 years ago

@elliotleelewis What is attribute you need?

@alexander-akait The URL property in style attributes, like so:

<div id="background-image" style="background-image: url('./assets/media/photo.jpg')"></div>
alexander-akait commented 3 years ago

Yep, try to find time on this at the end of month...

elliotleelewis commented 3 years ago

Yep, try to find time on this at the end of month...

Perfect, thank you!