How to use webpack?

help
1

I have vue+vuetify project with meteor.
I need to overwrite vuetify sass variable.
So I need to use webpack.config.js file.
How can I use it?
This problem make me mad for 3 days…
Is there no way? :sob:

1 Like
2

I’m pretty sure you can overwrite variables by defining them before loading their scss (like you can with boostrap).
Looking at their _variables.scss file, they are all !defaults which means it’ll only set the value if it doesn’t aleady exist

What you do is create a sass file like this:

// set all the variables you want to change
$body-font-family: 'Roboto', sans-serif;
$font-size-root: 16px;
$line-height-root: 1.5;
$border-radius-root: 4px;

// Then import their root sass file, so that it's processed in the same context as this file.
@import '{}/node_modules/vuetify/src/styles/main.sass';

And use this method to load their styles instead of loading their bundled css

1 Like