How do I get the ripple effect work in Varlet UI?

Question

I am using Vue v3.2.20 with Varlet UI v1.25.0 and Bootstrap 5 in my project. So far everything worked well, but I can't get the ripple effect working anywhere, even on the buttons. I don't get any errors or warnings in the console. A simple button declaration like this:

<var-button type="primary">Add</var-button>

shows up a default button without the ripple effect. I imported the framework in main.js as so:

import { createApp } from 'vue'
import App from './App.vue'
import router from './router'

import Varlet from '@varlet/ui'
import '@varlet/ui/es/style.js'

createApp(App).use(router).use(Varlet).mount('#app')

Also, I tried to add the ripple effect manually on a div per this documentation, still no luck.