Переопределить Vuetify 2 SASS переменных сетки, работает, но порядок выходных классов неверен - PullRequest
1 голос
/ 17 марта 2020

Я только что создал чистый 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 никогда не применяется.

CSS panel in DevTools

Это ошибка? Или я что-то не так делаю?

Я попытался добавить переменные .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

...