How to @import with v-bind VueJS 3 SFC style

Question

I want to dynamically load import scss in vuejs single file component, but it seems not supported.

<script>
export default {
  computed: {
    importMobileCss() {
      return this.ISMOBILE ? "/src/css/stylist-mobile.scss"  : "/src/css/stylist-desktop.scss";
    },
}
</script>
<style lang="scss" scoped>
@import "/src/css/stylist.scss";
@import v-bind(importMobileCss);
</style>

I had tried to import dynamically import using in script tag which is worked well but the result is not I want to achieved as it is scoped scss, therefore the required(scss) is not scoping in the html css.

<script>
export default {
  mounted() {
    if(this.ISMOBILE)
        require("/src/css/stylist-mobile.scss")
    else
        require("/src/css/stylist-desktop.scss")
}
</script>
<style lang="scss" scoped>
@import "/src/css/stylist.scss";
</style>