How to pass css module styling to child compontents - css

Question

Before I begin, my question is about vue and bootstrap, but can be applied to any project with multiple ui frameworks that share class names.
I have an older project that uses bootstrap 2.0.0. I added Vue for new modules and I want to use bootstrap 4 in those.
If I would just add bootstrap 4 a lot of the project will break so I need to add it only to the new modules but im running into some trouble. I tried a lot of things but without a perfect solution. Here are some of the things I tried:
Scoped CSS:
component1.vue
<style lang="scss" scoped>
#import "~bootstrap/scss/bootstrap"
</style>
Pros: Rest of application wont break (bootstrap4 is only applied to this module).
Con: Bootstrap 2 is also still applied to this module, breaking this module.
Most important con: Every vue module will load in the entirety of bootstrap 4. So if I made more vue components in te future (which I will) I will get insane overhead.
CSS Module:
component1.vue
<style lang="scss" module>
#import "~bootstrap/scss/bootstrap"
</style>
Pro over scoped: This module wont break since classnames are hashed
Con: Same mayor con as scoped: Mayor overhead with multiple vue components.
What I thought was the magic fix:
components.vue
<template>
<div class="vue-components">
<component1></component1>
<component2></component2>
</div>
</template>
<script>
import component1 from './component1'
import component2 from './component2'
export default {
name: 'components',
components: {
component2,
component1
}
}
</script>
<style lang="scss" module>
#import "~bootstrap/scss/bootstrap";
</style>
The idea here is to add bootstrap as a module in a wrapper vue file and importing every component in it so that we only load bootstrap 4 once for every vue component. However the child components (component1 and component 2) don't get access to the styling. So it seems that imports are excluded from the module styles.
How would I be able to add bootstrap only to the new Vue components without exposing the old code to it (and also shielding the new components from the old bootstrap 2)?