DEV Community

Discussion on: Use Vue to create a SPA without any Node modules

Collapse
 
pablocamelcase profile image
Pablo Espinosa • Edited

This is amazing, thanks a lot for it.
Just a question, how would you add styles/css to the independent components? 🤓

Collapse
 
arswaw profile image
Arswaw • Edited

That's a really good question. For now I've just been using global styles and then applying specific classes to the template files. An example:


<div class="specific-component-class">

This class is only used for this component, but is stored in a global file like style.css

CSS Modules might be the key, if we can use them without Node.js

Collapse
 
pablocamelcase profile image
Pablo Espinosa

Hey
I've found out that you can use scoped CSS to solve that issue. And works flawlessly.
vue-loader.vuejs.org/guide/scoped-...

Collapse
 
arswaw profile image
Arswaw

I was recently informed by Jay that you can use Goober CSS as a lightweight ES6-compatible way to add scoped CSS to each component while still avoiding Node.js!

Here's an example that Jay made.

plnkr.co/edit/tjhkcfNO15aTNhsU