Quasar Error Reading External Library Component - vue.js

Question

I have installed an external library (vuejs-progress-bar) in Quasar and I'm getting an error which says:
boot error: TypeError: Cannot read properties of undefined (reading 'component')
I'm not quite sure what went wrong, here's what I did in my boot file:
import { boot } from "quasar/wrappers";
import { ProgressBar } from "vuejs-progress-bar";
export default boot(async ({ app }) => {
app.use(ProgressBar);
});
here's my progress-bar code (I followed from their docs https://github.com/larsmars/vuejs-progress-bar):
<progress-bar :options="options" value="0" />
script:
export default {
data() {
return {
options: {
text: {
color: "#FFFFFF",
shadowEnable: true,
shadowColor: "#000000",
fontSize: 14,
fontFamily: "Helvetica",
dynamicPosition: false,
hideText: false,
},
progress: {
color: "#2dbd2d",
backgroundColor: "#333333",
inverted: false,
},
layout: {
height: 35,
width: 140,
verticalTextAlign: 61,
horizontalTextAlign: 43,
zeroOffset: 0,
strokeWidth: 30,
progressPadding: 0,
type: "line",
},
},
};
},
methods: {},
created() {},
};