如何更改 vuetify v2 中 scss 中的断点？

我正在使用 scss 文件，我想更改 vuetify v2 中 css 端的断点。

我在 vuetify 升级指南中找不到任何参考。

在 1.5 版本中我做了 style-x.styl：

$grid-breakpoints := {
  xs: 0
  sm: 476px
  md: 668px
  lg: 1000px
  xl: 1300px
}
@import '~vuetify/src/styles/styles.sass';

$material-light.background = #f5f5f5;

@import '~vuetify/src/stylus/main';

然后我导入文件：

import '../style-x.styl';
...
Vue.use(Vuetify);
...

那么看看文档：https://vuetifyjs.com/en/customization/sass-variables/#vue-cli-install https://vuetifyjs.com/en/customization/sass-variables/#vue-cli-install， 它说：

安装后，在您的文件中创建一个名为 sass、scss 或 styles 的文件夹 src 目录，其中包含名为variables.scss 或variables.sass 的文件

也就是说，在我们使用以下命令创建项目之后Vue CLI，我们手动：

1. 创造新sass文件夹在我们的src文件夹。
2. 接下来，在我们的新sass文件夹，新建变量.scss file.
3. 接下来，在我们的新变量.scss文件，写这些行，这些 是 bootstrap-4 的标准设置：

*

$grid-breakpoints: (
  xs: 0,
  sm: 576px,
  md: 768px,
  lg: 992px,
  xl: 1200px
);

4. 现在重新启动npm 运行服务你准备好了。您可以将 $grid-breakpoints 变量中的值更改为您自己的值。