reduce bundle size

src/library/album/AlbumDetails.vue

@@ -16,12 +16,12 @@
           <span v-if="album.genre"> • {{ album.genre }}</span>
         </p>
         <div class="text-nowrap">
-          <b-btn variant="secondary" class="mr-2" @click="play">
+          <b-button variant="secondary" class="mr-2" @click="play">
             <Icon icon="play-fill" /> Play
-          </b-btn>
+          </b-button>
-          <b-btn variant="secondary" class="mr-2" @click="toggleStar">
+          <b-button variant="secondary" class="mr-2" @click="toggleStar">
             <Icon :icon="album.starred ? 'star-fill' : 'star'" />
-          </b-btn>
+          </b-button>
         </div>
       </div>
     </div>

src/main.ts

@@ -1,7 +1,6 @@
 import Vue from 'vue'
 import Router from 'vue-router'
 import Vuex from 'vuex'
-import { BootstrapVue } from 'bootstrap-vue'
 import '@/style/main.scss'
 import '@/shared/components'
 import App from '@/app/App.vue'
@@ -21,7 +20,6 @@ declare module 'vue/types/vue' {
 Vue.config.productionTip = false
 Vue.use(Router)
 Vue.use(Vuex)
-Vue.use(BootstrapVue)
 
 const authService = new AuthService()
 const api = new API(authService)

src/shared/components/index.ts

@@ -6,6 +6,31 @@ import InfiniteLoader from './InfiniteLoader.vue'
 import OverflowMenu from './OverflowMenu.vue'
 import Tiles from './Tiles.vue'
 import Tile from './Tile.vue'
+import {
+  BAlert,
+  BAvatar,
+  BButton,
+  BFormCheckbox,
+  BFormGroup,
+  BFormInput,
+  BModal,
+  BProgress,
+  BSidebar,
+  BSpinner,
+  DropdownPlugin,
+} from 'bootstrap-vue'
+
+Vue.component('BModal', BModal)
+Vue.component('BAlert', BAlert)
+Vue.component('BAvatar', BAvatar)
+Vue.component('BSidebar', BSidebar)
+Vue.component('BFormGroup', BFormGroup)
+Vue.component('BFormInput', BFormInput)
+Vue.component('BFormCheckbox', BFormCheckbox)
+Vue.component('BButton', BButton)
+Vue.component('BProgress', BProgress)
+Vue.component('BSpinner', BSpinner)
+Vue.use(DropdownPlugin)
 
 const components = {
   ContentLoader,