Vue.js load component theme without Vue.use

Question

I am using Cool-Select and it requires the following code to load its theme:

import VueSelect from 'vue-cool-select'
Vue.use(VueSelect, {
  theme:'material-design'
})

The problem is that I do not want to have to import the entire vue code in order to just use a theme. Also, the components works fini without the theme import; just missing css.

Is it possible to import the theme locally instead in the components part like this?

import { CoolSelect } from 'vue-cool-select'      
components:{
        CoolSelect,
        // import theme here
 },

It's unclear what you mean. What's VueSelect and why do you not want to use Vue.use, considering that it requires to use it? — Estus Flask, Jun 12 '19 at 10:30

score 0 · Accepted Answer · answered Jun 12 '19 at 11:25

VueSelect is a plugin, i.e. it has install method that will be called when provided to Vue.use. This doesn't affect the application except that it loads styles that are specific to this component.

Since styles weren't exported from the package and are loaded only on plugin installation, this is the only way how CoolSelect component can have its styles loaded without forking the package:

Vue.use(VueSelect, {
  theme:'material-design'
})

Vue.js load component theme without Vue.use

1 Answers1