Vue-multiselect: Why is not there a .css file?
I added the styles as stated here: http://monterail.github.io/vue-multiselect/#sub-getting-started
<template lang="html">
<div id="app">
<multiselect v-model="multitags.selected" :options="multitags.list" :multiple="true" :close-on-select="false" :clear-on-select="false" :hide-selected="true" placeholder="Pick some" label="title" track-by="id" @search-change="fetchTags"></multiselect>
</div>
</template>
<script>
import Multiselect from 'vue-multiselect'
export default {
//
}
</script>
<style src="vue-multiselect/dist/vue-multiselect.min.css"></style>
Everything works, but there are no styles.
It looks like this:
What is the problem? There are no errors in the browser console. Styles on the page in the browser are not connected.
afuno
All 12 comments
Have you installed using the @next tag?
Like
npm install vue-multiselect@next --save
shentao
on 5 Jun 2017
@shentao Yes. I installed just that.
yarn add vue-multiselect@next
If I write, for example, this code:
<style src="vue-multiselect/disssst/vue-multiselect.min.css"></style>
I'll get an error about the nonexistent file.
But if I write correctly:
<style src="vue-multiselect/dist/vue-multiselect.min.css"></style>
There will be no errors in the browser console.
afuno
on 5 Jun 2017
That鈥檚 weird. Have you checked if the styles are added within the <head> tag? Also please make sure to not use scoped there.
shentao
on 5 Jun 2017
@shentao If I add this code to the <head> of the page:
<style src="https://unpkg.com/[email protected]/dist/vue-multiselect.min.css"></style>
Styles are connected on the page. But they are not used (no properties).
afuno
on 5 Jun 2017
I meant the <style> tag inside <head>
shentao
on 5 Jun 2017
@shentao Yes. That's exactly what I did.
afuno
on 5 Jun 2017
Weird. Could you try adding @import vue-multiselect/dist/vue-multiselect.min.css within the style tag? They should show up inside <head> :S
shentao
on 5 Jun 2017
I'm using like this:
import Multiselect from 'vue-multiselect'
import 'vue-multiselect/dist/vue-multiselect.min.css'
And it's working just fine.
lucascc
on 9 Jun 2017
@afuno It should be working. Maybe there are some problems within your setup itself? Can鈥檛 think about any other possible problem here. :/
shentao
on 10 Jun 2017
why css file not load in package?
i am using npm install vue-multiselect --save
hekmatinasser
on 23 Aug 2017
not load with vue-multiselect@next
only way import 'vue-multiselect/dist/vue-multiselect.min.css'
this problem is rational?
hekmatinasser
on 23 Aug 2017
Related issues
andreasvirkus
路
3Comments
zachleigh
路
3Comments
wujekbogdan
路
4Comments
dmitov
路
4Comments
wujekbogdan
路
4Comments
Most helpful comment
I'm using like this:
import Multiselect from 'vue-multiselect'
import 'vue-multiselect/dist/vue-multiselect.min.css'
And it's working just fine.