Я только что создал чистый Vue CLI 4 проект и добавил Vuetify Vue CLI. На этом этапе все работает без проблем.
При добавлении variables.scss
возникает проблема:
$grid-breakpoints: (
'xxs': 0,
'xs': 375,
'sm': 600px,
'md': 960px,
'lg': 1280px - 16px,
'xl': 1920px - 16px,
'xxl': 2560px - 16px
);
Я написал простой шаблон из 3 столбцов:
<v-row>
<v-col cols="12" md="4">1</v-col>
<v-col cols="12" md="4">1</v-col>
<v-col cols="12" md="4">1</v-col>
</v-row>
Я ожидаю, что имеют 3 столбца размером md
, но специфичность .col-12
выше, чем .col-md-4
, и col-md-4 никогда не применяется.
Это ошибка? Или я что-то не так делаю?
Я попытался добавить переменные .s css, добавив его в vue .config. js, попытался импортировать переменные .s css node_modules / vuetify при первом / последняя строка моего файла переменных.
vuetify версия: 2.2.17
sass версия: 1.25.0
vuetify-loader версия: 1.4.3
Github source код примера проекта: https://github.com/mort3za/temp-vuetify