Published vue component has no css (NPM)

Question

This is the first time I am publishing a Vue component to NPM and everything works fine, except the fact that the CSS is not present. It all works as expected when I run it locally but if I create a test project, install the npm package and import the component there is no CSS.

Steps to reproduce:

Create a new Vue project
run npm install elementable-vue
Use this template for App.vue: https://github.com/sandermaas/elementable-vue/blob/master/src/App.vue
Change the import (in the template) to import ElemenTable from 'elementable-vue'
run 'npm run serve'

You can check out the source code on https://github.com/sandermaas/elementable-vue

I can't figure out why this is not working so any help is very much appreciated.

Suresh Suresh · Accepted Answer · 2019-11-24T08:35:41

You need to import your css as well in app.vue of your newly created project:

<style>
  @import '~elementable-vue/dist/elementable-vue.css';
</style>

Published vue component has no css (NPM)

1 Answers