Search code examples
htmlvue.jswebpackmeta

How to load local image to meta tag in html with webpack

I have a meta tag that should look like this

<meta property="og:image" content="https://mywebsite/img.jpg" />

I can't just set it to be './images/img.jpg'

I use webpack to compile my background images from my vue app so I can load this image somewhere in my template as background and then set it index.html in build folder. But it seems strange to do so and also webpack hashes images so they have different names after every build.

Is there a way out? Can I use HtmlWebpackPlugin maybe for this?

Solution

  • Ok, I think I solved the problem with this line of code in my index.html (not in build folder)

    <meta property="og:image" content="<%= require('./images/img.jpg') %>" />