I am learning VueJs nowadays and it's Awesome! VueJS community is very strong, I think I can also contribute to it by writing this post.
Bulma.css is the main driver right now to make responsive designs and it's very customizable and modular as they say, You can easily integrate it into VueJS workflow. It's not like just using the cdnjs version, you can customize the SaSS variables to give Bulma your own theme or almost control everything from the border's color to the table header's padding with Bulma SaSS variables.
You can read this beautifully written article : https://dev.to/helleworld_/integrating-dart-node-sass-in-vuejs-4o39
Na Na Na, the CDNJS will not work here. you have to install it through npm :
npm install bulma
yarn add bulma
Now Check out the
package.json you will find Bulma there in dependencies
make a file named whatever and place wherever in
/src' with.scss` file extension.
you can import the sass file of Bulma from
/.node-modules into this file like this and customize it, you have to set Bulma Variables before importing Bulma like this. Provide the right path from node-modules
I don't know if it's the right way to connect the Bulma with VueJs, but it's working fine for me. By this, you don't have to care about the generated CSS files or sass loader. In this way, you can connect your Bulma and sass: **You have to provide the exact path to your file. In My Case it is
There is another thing called Buefy, Ali wrote a fantastic post about this : https://dev.to/aligoren/bulma-based-ui-components-for-vuejs-41i4.
Bye Bye, I'm active on Twitter : twitter.com/justaashir.
- My Popular Article about Bulma : Bulma - The Most Underrated Framework of the CSS framework Era