Help: Using images in carousel
See original GitHub issueHow may I use images from my project in img tag of b-carousel-slide? I’m trying to define img=“~@/assets/img/thumbnails/01.jpg”, but it doesn’t works.
<div class="container-fluid">
<div class="container">
<b-carousel controls indicators :interval="7000" background="#ABABAB" height="300px">
<!-- Text slides -->
<b-carousel-slide height="300px" caption="First slide" text="Nulla vitae elit libero, a pharetra augue mollis interdum." img="~@/assets/img/thumbnails/01.jpg">
</b-carousel-slide>
</b-carousel>
</div>
</div>
Issue Analytics
- State:
- Created 6 years ago
- Reactions:2
- Comments:12 (7 by maintainers)
Top Results From Across the Web
How to Use Image Carousels the Right Way [2022]? | VWO
Learn how to use image carousels, manual sliders, and hero images place of auto ... here are a few image carousel alternatives you...
Read more >How to use image carousel - Looking for a little help?
1. On a page, click IMAGE on the media toolbar and select one of the images you would like to add to the...
Read more >Carousel best practices & images - ClubRunner Support
Best Practices. For the ClubRunner carousel widget, we recommend keeping all photos the same size via their dimensions, height and width.
Read more >How To Use The Image Carousel Element - YouTube
In this series of videos, we are looking at how to use the Avada Builder Elements. This video looks at how to use...
Read more >How to Use Instagram Carousels to 10x Engagement [Guide]
An Instagram carousel is a post with up to 10 photos or videos. Mobile Instagram users can view carousel posts by swiping left,...
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
I know this is an old issue, but here is a solution. In your vue-loader config options, you need to instruct it to know which props are available to be transformed via the
transformToRequire
option ofvue-loader
:The default for
transformToRequire
is:transformToRequire: { img: ‘src’, image: ‘xlink:href’ }
Is possible resolve this issue? I mean, every place in Vue and Vue-Bootstrap I can use images from assets folder, just in Carousel this happens.