v1.0.0
This release brings in some quality of life changes/fixes and reduces the amount of actions a user has to take in order to enable certain features in Vuetify.
- sass variables are automatically hoisted for
src/sass/variables.s(a|c)ss
- if you already have a
src/sass/main.s(a|c)ss
file, just rename tovariables
- if you already have a
- on creation of new projects, will automatically update
vue.config.js
to transpilevuetify
- will now lint after creation
- will no longer attempt to compile styles when
NODE_ENV=testing
If you are installing Vuetify in a new project, simply create a variables.s(a|c)ss
file in src/sass
.
🔧 Bug fixes
- fix(service): apply default objects to package.json dep/devDep properties (80f727b)
- fix: remove sass processing in testing env (9169fac)
🚀 Features
- feat: add Lithuanian locale (de34cca)
- feat: add Czech locale (60bc318)
- feat: add Swedish locale (6e4d1b8)
- feat(LICENSE.md): add license file (4e84c85)
📑 Upgrade guide
vue.config.js
If you have previous configurations in your vue.config that resemble anything below, you can safely remove them.
// vue.config.js
module.exports = {
css: {
loaderOptions: {
sass: {
data: `@import "~@/sass/main.scss"`,
},
scss: {
data: `@import "~@/sass/main.scss";`,
},
},
},
chainWebpack: config => {
["vue-modules", "vue", "normal-modules", "normal"].forEach((match) => {
config.module.rule('scss').oneOf(match).use('sass-loader')
.tap(opt => Object.assign(opt, { data: `@import '~@/sass/main.scss';` }))
})
}
}
In the past this was a manual step that the user had to take. It is now handled automatically.
main.sass
This was also a manual step on the Vuetify documentation that is now automated. Any non component variable imports such as ~vuetify/src/styles/styles.sass
can be removed. This is now pre-loaded before all user variables and automatically available in src/sass/variables.s(a|c)ss
.
v0.6.2
// src/sass/main.scss
$border-radius-root: 6px;
$font-size-root: 14px;
@import '~vuetify/src/styles/styles.sass';
@import '~vuetify/src/components/VBtn/_variables.scss';
$fab-icon-sizes: map-deep-set($fab-icon-sizes, 'small', 20);
$headings: map-deep-set($headings, 'h1 size', 3rem);
v1.0.0
// src/sass/variables.scss
@import '~vuetify/src/components/VBtn/_variables.scss';
$border-radius-root: 6px;
$font-size-root: 14px;
$fab-icon-sizes: map-deep-set($fab-icon-sizes, 'small', 20);
$headings: map-deep-set($headings, 'h1 size', 3rem);
If you have a main.s(a|c)ss file, just rename it to variables.s(a|c)ss
where (a|c) is for sass or scss.