如何使用 vuetify@2.0.0-beta7

Posted 2023-02-22

【中文标题】如何使用 vuetify@2.0.0-beta7

【英文标题】：How to use vuetify@2.0.0-beta7

【发布时间】：2019-11-21 00:46:45

【问题描述】：

我正在使用 vue-cli 和 vuetify 来创建项目。

我想用最新的vuetify2.0.0 beta7。

但是我遇到了一些问题，

当我输入'yarn start'来预览时，它给出了很多问题，

好像css都有问题，

全部在./node_modules/vuetify/src/components/xxx/xxx.sass，

这是其中的一些：

 error  in ./node_modules/vuetify/src/components/VBtnToggle/VBtnToggle.sass

Module build failed:
undefined
   ^
      Invalid CSS after "    @content": expected "", was "($material-light); "
      in D:\Workspace\VSCode\pr-re\node_modules\vuetify\src\styles\tools\_theme.sass (line 3, column 5)

 @ ./node_modules/vuetify/src/components/VBtnToggle/VBtnToggle.sass 4:14-184 13:3-17:5 14:22-192
 @ ./node_modules/vuetify/lib/components/VBtnToggle/VBtnToggle.js
 @ ./node_modules/vuetify/lib/components/VBtnToggle/index.js
 @ ./node_modules/vuetify/lib/components/index.js
 @ ./node_modules/vuetify/lib/index.js
 @ ./src/plugins/vuetify.js
 @ ./src/main.js
 @ multi (webpack)-dev-server/client?http://0.0.0.0:8080 webpack/hot/dev-server ./src/main.js

我尝试从现有项目中更新并创建一个新项目，但他们最终给了我同样的问题。

我这样做是为了更新（当前 vuetify 版本是 ^1.5.14）：

输入yarn add vuetify@2.0.0，选择beta7；

将一些导入代码从 main.js 迁移到 src/plugins/vuetify.js

运行 dev，它告诉我丢失了 sass-loader，所以我输入 yarn add sass-loader

再次运行 dev，我遇到了问题

我想解决类似 css 的问题，让我在我的项目中使用 vuetify。

【参考方案1】：

你需要安装sass:

$ yarn add sass sass-loader fibers deepmerge -D
// OR
$ npm install sass sass-loader fibers deepmerge -D

更多信息请见upgrade guide。